未验证 提交 9ab97a4d 编写于 作者: P Peter Pan 提交者: GitHub

add dev server & udpate readme (#614)

* build(server): add dev server

* doc: add readme

* fix: remove unused logger

* chore: update dependencies

* fix: dependency version mismatching

* fix: new types for express

* style: more type checks when commit
上级 e6cc798e
<p align="center"> <p align="center">
<a href="https://github.com/PaddlePaddle/VisualDL"><img align="center" style="width:480px" width="480" src="https://raw.githubusercontent.com/PaddlePaddle/VisualDL/develop/frontend/public/images/logo-visualdl.svg?sanitize=true" alt="VisualDL" /></a> <a href="https://github.com/PaddlePaddle/VisualDL"><img align="center" style="width:480px" width="480" src="https://raw.githubusercontent.com/PaddlePaddle/VisualDL/develop/frontend/packages/core/public/images/logo-visualdl.svg?sanitize=true" alt="VisualDL" /></a>
</p> </p>
<br /> <br />
<p align="center"> <p align="center">
<a href="https://www.npmjs.com/package/visualdl"><img src="https://img.shields.io/npm/v/visualdl?style=flat-square" alt="NPM Version" /></a>
<a href="https://travis-ci.org/PaddlePaddle/VisualDL"><img src="https://img.shields.io/travis/PaddlePaddle/VisualDL?style=flat-square" alt="Build Status" /></a> <a href="https://travis-ci.org/PaddlePaddle/VisualDL"><img src="https://img.shields.io/travis/PaddlePaddle/VisualDL?style=flat-square" alt="Build Status" /></a>
<a href="https://github.com/PaddlePaddle/VisualDL"><img src="https://img.shields.io/github/languages/top/PaddlePaddle/VisualDL?style=flat-square" alt="GitHub top language" /></a> <a href="https://github.com/PaddlePaddle/VisualDL"><img src="https://img.shields.io/github/languages/top/PaddlePaddle/VisualDL?style=flat-square" alt="GitHub top language" /></a>
<a href="https://github.com/prettier/prettier"><img src="https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square" alt="code style: prettier" /></a> <a href="https://github.com/prettier/prettier"><img src="https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square" alt="code style: prettier" /></a>
<a href="https://lerna.js.org/"><img src="https://img.shields.io/badge/maintained%20with-lerna-cc00ff.svg?style=flat-square" alt="lerna"></a>
<a href="https://github.com/PaddlePaddle/VisualDL/blob/develop/LICENSE"><img src="https://img.shields.io/github/license/PaddlePaddle/VisualDL?style=flat-square" alt="License" /></a> <a href="https://github.com/PaddlePaddle/VisualDL/blob/develop/LICENSE"><img src="https://img.shields.io/github/license/PaddlePaddle/VisualDL?style=flat-square" alt="License" /></a>
<a href="https://github.com/PaddlePaddle/VisualDL/issues"><img src="https://img.shields.io/github/issues/PaddlePaddle/VisualDL?style=flat-square" alt="GitHub issues" /></a>
<a href="https://github.com/PaddlePaddle/VisualDL/graphs/contributors"><img src="https://img.shields.io/github/contributors/PaddlePaddle/VisualDL?style=flat-square" alt="GitHub Contributors" /></a> <a href="https://github.com/PaddlePaddle/VisualDL/graphs/contributors"><img src="https://img.shields.io/github/contributors/PaddlePaddle/VisualDL?style=flat-square" alt="GitHub Contributors" /></a>
<a href="https://github.com/PaddlePaddle/VisualDL/stargazers"><img src="https://img.shields.io/github/stars/PaddlePaddle/VisualDL?style=social" alt="GitHub stars" /></a> <a href="https://github.com/PaddlePaddle/VisualDL/stargazers"><img src="https://img.shields.io/github/stars/PaddlePaddle/VisualDL?style=social" alt="GitHub stars" /></a>
</p> </p>
...@@ -18,29 +17,23 @@ ...@@ -18,29 +17,23 @@
English | [简体中文](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/README_cn.md) English | [简体中文](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/README_cn.md)
**🚧UNDER DEVELOPMENT🚧**
**🚧SOME FEATURE MAY NOT WORK PROPERLY🚧**
**🚧PULL REQUESTS WELCOMED🚧**
## Usage ## Usage
> nodejs ≥ 10 and npm ≥ 6 are required. > nodejs ≥ 10 and npm ≥ 6 are required.
```bash ```bash
npm install -g visualdl npm install -g @visualdl/cli
# or # or
yarn global add visualdl yarn global add @visualdl/cli
``` ```
Then you can start visualdl server by Then you can start VisualDL server by
```bash ```bash
visualdl start --backend="http://127.0.0.1:8040" visualdl start --backend="http://127.0.0.1:8040"
``` ```
To stop visualdl server, just type To stop VisualDL server, just type
```bash ```bash
visualdl stop visualdl stop
...@@ -54,53 +47,60 @@ visualdl -h ...@@ -54,53 +47,60 @@ visualdl -h
## Development ## Development
First, install all dependencies:
```bash ```bash
npm install npm install && npm run bootstrap
# or # or
yarn yarn
``` ```
Then you can start the development server: > Notice: if you have yarn installed globally, you don't need to bootstrap because yarn workspace will do it for you.
```bash ## Packages
yarn dev
```
Now open [http://localhost:8999](http://localhost:8999) with your browser. [core](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/packages/core/README.md)
[server](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/packages/server/README.md)
[serverless](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/packages/serverless/README.md)
[cli](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/packages/cli/README.md)
[app](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/packages/app/README.md)
[i18n](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/packages/i18n/README.md)
[wasm](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/packages/wasm/README.md)
[mock](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/packages/mock/README.md)
You can change the port with `PORT` environment variable: ## Build & Deploy
```bash > We only support building on Linux/MacOS now.
PORT=3000 yarn dev
```
### WebAssembly Run:
WebAssembly is **DISABLED** by default under development environment. ```bash
yarn build
```
If you want to develop wasm features, you must have [Rust](https://www.rust-lang.org/) and [Cargo](https://doc.rust-lang.org/cargo/) installed. You will get `server.tar.gz` and `serverless.tar.gz` in `output` directory.
Using [rustup](https://rustup.rs/) to install them. ### Server deployment
Then install [wasm-pack](https://rustwasm.github.io/wasm-pack/installer/) to build rust code to wasm binaries. > nodejs ≥ 10 and npm ≥ 6 are required.
When environment is ready, start the development server with following command: Extract `server.tar.gz` to wherever you want.
`cd` into the directory and run:
```bash ```bash
yarn dev:wasm npm install --production
``` ```
## Build & Deploy Then use:
```bash ```bash
./scripts/build.sh npm start
```
yarn start to start a production server.
# we are working on deployment now, please wait ### Serverless deployment
```
Extract `serverless.tar.gz` to your `webroot`.
Just start your web server and enjoy.
### Browser Compatibility ### Browser Compatibility
......
<p align="center"> <p align="center">
<a href="https://github.com/PaddlePaddle/VisualDL"><img align="center" style="width:480px" width="480" src="https://raw.githubusercontent.com/PaddlePaddle/VisualDL/develop/frontend/public/images/logo-visualdl.svg?sanitize=true" alt="VisualDL" /></a> <a href="https://github.com/PaddlePaddle/VisualDL"><img align="center" style="width:480px" width="480" src="https://raw.githubusercontent.com/PaddlePaddle/VisualDL/develop/frontend/packages/core/public/images/logo-visualdl.svg?sanitize=true" alt="VisualDL" /></a>
</p> </p>
<br /> <br />
<p align="center"> <p align="center">
<a href="https://www.npmjs.com/package/visualdl"><img src="https://img.shields.io/npm/v/visualdl?style=flat-square" alt="NPM Version" /></a>
<a href="https://travis-ci.org/PaddlePaddle/VisualDL"><img src="https://img.shields.io/travis/PaddlePaddle/VisualDL?style=flat-square" alt="Build Status" /></a> <a href="https://travis-ci.org/PaddlePaddle/VisualDL"><img src="https://img.shields.io/travis/PaddlePaddle/VisualDL?style=flat-square" alt="Build Status" /></a>
<a href="https://github.com/PaddlePaddle/VisualDL"><img src="https://img.shields.io/github/languages/top/PaddlePaddle/VisualDL?style=flat-square" alt="GitHub top language" /></a> <a href="https://github.com/PaddlePaddle/VisualDL"><img src="https://img.shields.io/github/languages/top/PaddlePaddle/VisualDL?style=flat-square" alt="GitHub top language" /></a>
<a href="https://github.com/prettier/prettier"><img src="https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square" alt="code style: prettier" /></a> <a href="https://github.com/prettier/prettier"><img src="https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square" alt="code style: prettier" /></a>
<a href="https://lerna.js.org/"><img src="https://img.shields.io/badge/maintained%20with-lerna-cc00ff.svg?style=flat-square" alt="lerna"></a>
<a href="https://github.com/PaddlePaddle/VisualDL/blob/develop/LICENSE"><img src="https://img.shields.io/github/license/PaddlePaddle/VisualDL?style=flat-square" alt="License" /></a> <a href="https://github.com/PaddlePaddle/VisualDL/blob/develop/LICENSE"><img src="https://img.shields.io/github/license/PaddlePaddle/VisualDL?style=flat-square" alt="License" /></a>
<a href="https://github.com/PaddlePaddle/VisualDL/issues"><img src="https://img.shields.io/github/issues/PaddlePaddle/VisualDL?style=flat-square" alt="GitHub issues" /></a>
<a href="https://github.com/PaddlePaddle/VisualDL/graphs/contributors"><img src="https://img.shields.io/github/contributors/PaddlePaddle/VisualDL?style=flat-square" alt="GitHub Contributors" /></a> <a href="https://github.com/PaddlePaddle/VisualDL/graphs/contributors"><img src="https://img.shields.io/github/contributors/PaddlePaddle/VisualDL?style=flat-square" alt="GitHub Contributors" /></a>
<a href="https://github.com/PaddlePaddle/VisualDL/stargazers"><img src="https://img.shields.io/github/stars/PaddlePaddle/VisualDL?style=social" alt="GitHub stars" /></a> <a href="https://github.com/PaddlePaddle/VisualDL/stargazers"><img src="https://img.shields.io/github/stars/PaddlePaddle/VisualDL?style=social" alt="GitHub stars" /></a>
</p> </p>
...@@ -18,64 +17,91 @@ ...@@ -18,64 +17,91 @@
[English](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/README.md) | 简体中文 [English](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/README.md) | 简体中文
**🚧开发中🚧** ## 使用
**🚧某些功能可能不能正常工作🚧** > 要求 nodejs ≥ 10 并且 npm ≥ 6
**🚧欢迎 Pull Request🚧** ```bash
npm install -g @visualdl/cli
# or
yarn global add @visualdl/cli
```
## 开发 之后可以启动 VisualDL 服务:
> 要求 nodejs ≥ 10 并且 npm ≥ 6 ```bash
visualdl start --backend="http://127.0.0.1:8040"
```
首先,安装所有依赖 要停止 VisualDL 服务
```bash ```bash
npm install visualdl stop
# 或者
yarn
``` ```
之后可以启动开发服务 更多详情
```bash ```bash
yarn dev visualdl -h
``` ```
现在可以用浏览器打开 [http://localhost:8999](http://localhost:8999) ## 开发
你可以使用 `PORT` 环境变量更改服务的端口:
```bash ```bash
PORT=3000 yarn dev npm install && npm run bootstrap
# or
yarn
``` ```
### WebAssembly > 注意:如果你全局安装了 yarn,你不需要运行 bootstrap。因为 yarn 会帮你完成这一步。
在开发环境中,WebAssembly 默认是**禁用**的。 ## Packages
如果你希望开发 wasm 功能,你必须安装 [Rust](https://www.rust-lang.org/)[Cargo](https://doc.rust-lang.org/cargo/) [core](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/packages/core/README.md)
[server](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/packages/server/README.md)
[serverless](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/packages/serverless/README.md)
[cli](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/packages/cli/README.md)
[app](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/packages/app/README.md)
[i18n](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/packages/i18n/README.md)
[wasm](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/packages/wasm/README.md)
[mock](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/packages/mock/README.md)
使用 [rustup](https://rustup.rs/) 来安装它们。 ## 编译和部署
然后安装 [wasm-pack](https://rustwasm.github.io/wasm-pack/installer/) 来将 rust 代码编译成 wasm 可执行文件 > 目前仅支持 Linux/MacOS 上编译
当环境准备好后,使用下面的命令启动开发环境 运行
```bash ```bash
yarn dev:wasm yarn build
``` ```
## 编译和部署 你会在 `output` 文件夹中得到 `server.tar.gz``serverless.tar.gz`
### Server 部署
> 要求 nodejs ≥ 10 并且 npm ≥ 6
解压 `server.tar.gz` 到任何地方。
`cd` 到那个文件夹然后运行:
```bash ```bash
./scripts/build.sh npm install --production
```
yarn start 然后使用:
# 我们正在开发部署功能,请耐心等待 ```bash
npm start
``` ```
来启动生产服务。
### Serverless 部署
解压 `serverless.tar.gz` 到你的 `webroot` 中。
之后即可启动你的 Web 服务器并享受了。
### 浏览器兼容性 ### 浏览器兼容性
VisualDL 支持最新版本的 [Google Chrome](https://www.google.com/chrome/)[Mozilla Firefox](https://www.mozilla.org/)[Microsoft Edge](https://www.microsoft.com/edge)[Apple Safari](https://www.apple.com/safari/) 也许可以工作但是并未经过测试。 VisualDL 支持最新版本的 [Google Chrome](https://www.google.com/chrome/)[Mozilla Firefox](https://www.mozilla.org/)[Microsoft Edge](https://www.microsoft.com/edge)[Apple Safari](https://www.apple.com/safari/) 也许可以工作但是并未经过测试。
......
const path = require('path'); const path = require('path');
const fs = require('fs');
module.exports = { module.exports = {
'**/*.ts?(x)': async filenames => // lint all files when global package.json or eslint config changes.
'./(package.json|.eslintrc.js)': () => 'yarn lint',
// check types when ts file or package.json changes.
'packages/**/(*.ts?(x)|package.json)': filenames =>
[ [
...new Set( ...new Set(
filenames.map( filenames.map(
filename => path.relative(path.join(process.cwd(), 'packages'), filename).split(path.sep)[0] filename => path.relative(path.join(process.cwd(), 'packages'), filename).split(path.sep)[0]
) )
) )
].map(p => `tsc -p ${path.join(process.cwd(), 'packages', p, 'tsconfig.json')} --noEmit`), ]
.map(p => path.join(process.cwd(), 'packages', p, 'tsconfig.json'))
.filter(p => fs.statSync(p).isFile())
.map(p => `tsc -p ${p} --noEmit`),
// lint changed files
'**/*.(j|t)s?(x)': filenames => `eslint ${filenames.join(' ')}` '**/*.(j|t)s?(x)': filenames => `eslint ${filenames.join(' ')}`
}; };
...@@ -27,6 +27,7 @@ ...@@ -27,6 +27,7 @@
"directory": "frontend" "directory": "frontend"
}, },
"scripts": { "scripts": {
"bootstrap": "lerna bootstrap",
"build": "./scripts/build.sh", "build": "./scripts/build.sh",
"clean": "rimraf output */dist wasm/target", "clean": "rimraf output */dist wasm/target",
"lint": "eslint --ext .tsx,.jsx.ts,.js --ignore-path .gitignore .", "lint": "eslint --ext .tsx,.jsx.ts,.js --ignore-path .gitignore .",
...@@ -44,9 +45,9 @@ ...@@ -44,9 +45,9 @@
"eslint-plugin-prettier": "3.1.2", "eslint-plugin-prettier": "3.1.2",
"eslint-plugin-react": "7.19.0", "eslint-plugin-react": "7.19.0",
"eslint-plugin-react-hooks": "3.0.0", "eslint-plugin-react-hooks": "3.0.0",
"husky": "4.2.3", "husky": "4.2.5",
"lerna": "^3.20.2", "lerna": "^3.20.2",
"lint-staged": "10.1.2", "lint-staged": "10.1.3",
"prettier": "2.0.4", "prettier": "2.0.4",
"rimraf": "3.0.2", "rimraf": "3.0.2",
"typescript": "3.8.3", "typescript": "3.8.3",
......
# VisualDL FrontEnd APP
UNDER DEVELOPMENT
# VisualDL FrontEnd cli
## Usage
> nodejs ≥ 10 and npm ≥ 6 are required.
```bash
npm install -g @visualdl/cli
# or
yarn global add @visualdl/cli
```
Then you can start visualdl server by
```bash
visualdl start --backend="http://127.0.0.1:8040"
```
To stop visualdl server, just type
```bash
visualdl stop
```
For more usage infomation, please type
```bash
visualdl -h
```
...@@ -41,7 +41,7 @@ ...@@ -41,7 +41,7 @@
"yargs": "15.3.1" "yargs": "15.3.1"
}, },
"devDependencies": { "devDependencies": {
"@types/node": "13.11.0", "@types/node": "13.11.1",
"@types/yargs": "15.0.4", "@types/yargs": "15.0.4",
"cross-env": "7.0.2", "cross-env": "7.0.2",
"ts-node": "8.8.2", "ts-node": "8.8.2",
......
# VisualDL FrontEnd Core
This is core contents of VisualDL pages.
DO NOT use it directly.
## Development
You can start the development server by:
```bash
yarn dev
```
Now open [http://localhost:3000](http://localhost:3000) with your browser.
You can change the port with `PORT` environment variable:
```bash
PORT=8999 yarn dev
```
...@@ -61,19 +61,18 @@ ...@@ -61,19 +61,18 @@
"@types/dagre-d3": "0.4.39", "@types/dagre-d3": "0.4.39",
"@types/echarts": "4.4.5", "@types/echarts": "4.4.5",
"@types/lodash": "4.14.149", "@types/lodash": "4.14.149",
"@types/node": "13.11.0", "@types/node": "13.11.1",
"@types/nprogress": "0.2.0", "@types/nprogress": "0.2.0",
"@types/react": "16.9.32", "@types/react": "16.9.34",
"@types/react-dom": "16.9.6", "@types/react-dom": "16.9.6",
"@types/styled-components": "5.0.1", "@types/styled-components": "5.0.1",
"@types/webpack": "4.41.10",
"@visualdl/mock": "^2.0.0-beta.32", "@visualdl/mock": "^2.0.0-beta.32",
"babel-plugin-emotion": "10.0.33", "babel-plugin-emotion": "10.0.33",
"babel-plugin-styled-components": "1.10.7", "babel-plugin-styled-components": "1.10.7",
"babel-plugin-typescript-to-proptypes": "1.3.2", "babel-plugin-typescript-to-proptypes": "1.3.2",
"core-js": "3.6.4", "core-js": "3.6.5",
"cross-env": "7.0.2", "cross-env": "7.0.2",
"css-loader": "3.5.1", "css-loader": "3.5.2",
"ora": "4.0.3", "ora": "4.0.3",
"typescript": "3.8.3", "typescript": "3.8.3",
"worker-plugin": "4.0.2" "worker-plugin": "4.0.2"
......
# VisualDL FrontEnd I18n
This is a fork version of [next-i18next](https://github.com/isaachinman/next-i18next) to support serverless.
Will use [this](https://github.com/isaachinman/next-i18next/issues/652#issuecomment-600525867) to replace it in the feature.
## Build
```bash
yarn build
```
...@@ -37,7 +37,7 @@ ...@@ -37,7 +37,7 @@
"dependencies": { "dependencies": {
"detect-node": "2.0.4", "detect-node": "2.0.4",
"hoist-non-react-statics": "3.3.2", "hoist-non-react-statics": "3.3.2",
"i18next": "19.3.4", "i18next": "19.4.1",
"i18next-browser-languagedetector": "4.0.2", "i18next-browser-languagedetector": "4.0.2",
"i18next-express-middleware": "1.9.1", "i18next-express-middleware": "1.9.1",
"i18next-node-fs-backend": "2.1.3", "i18next-node-fs-backend": "2.1.3",
...@@ -48,10 +48,10 @@ ...@@ -48,10 +48,10 @@
"url": "0.11.0" "url": "0.11.0"
}, },
"devDependencies": { "devDependencies": {
"@types/express": "4.17.4", "@types/express": "4.17.6",
"@types/hoist-non-react-statics": "3.3.1", "@types/hoist-non-react-statics": "3.3.1",
"@types/node": "13.11.0", "@types/node": "13.11.1",
"@types/react": "16.9.32", "@types/react": "16.9.34",
"@types/react-dom": "16.9.6", "@types/react-dom": "16.9.6",
"typescript": "3.8.3" "typescript": "3.8.3"
}, },
......
# VisualDL FrontEnd Mock
Mock data for development.
## Build
```bash
yarn build
```
...@@ -11,7 +11,7 @@ const images = [ ...@@ -11,7 +11,7 @@ const images = [
]; ];
export default async (req: Request, res: Response) => { export default async (req: Request, res: Response) => {
const index = (req.query.index ?? 0) % images.length; const index = (+req.query.index ?? 0) % images.length;
const result = await fetch(images[index]); const result = await fetch(images[index]);
if (result.headers.has('Content-Type')) { if (result.headers.has('Content-Type')) {
res.type(result.headers.get('Content-Type') as string); res.type(result.headers.get('Content-Type') as string);
......
...@@ -16,7 +16,11 @@ export default (options: Options) => { ...@@ -16,7 +16,11 @@ export default (options: Options) => {
return async (req: Request, res: Response) => { return async (req: Request, res: Response) => {
let method = req.path; let method = req.path;
if (!method) { if (!method) {
method = Array.isArray(req.query.method) ? req.query.method.join('/') : req.query.method; method = Array.isArray(req.query.method)
? req.query.method.join('/')
: 'string' === typeof req.query.method
? req.query.method
: '';
} else { } else {
method = method.replace(/^\//, ''); method = method.replace(/^\//, '');
} }
......
...@@ -36,9 +36,9 @@ ...@@ -36,9 +36,9 @@
"isomorphic-unfetch": "3.0.0" "isomorphic-unfetch": "3.0.0"
}, },
"devDependencies": { "devDependencies": {
"@types/express": "4.17.4", "@types/express": "4.17.6",
"@types/faker": "4.1.11", "@types/faker": "4.1.11",
"@types/node": "13.11.0", "@types/node": "13.11.1",
"typescript": "3.8.3" "typescript": "3.8.3"
}, },
"peerDependencies": { "peerDependencies": {
......
# VisualDL FrontEnd Server
Serve VisualDL pages by NodeJS with SSR.
## Development
```bash
yarn dev
```
## Build
```bash
yarn build
```
## Start
```bash
yarn start
```
...@@ -3,13 +3,11 @@ ...@@ -3,13 +3,11 @@
import config from '@visualdl/core/next.config'; import config from '@visualdl/core/next.config';
import express from 'express'; import express from 'express';
import next from 'next'; import next from 'next';
import nextI18Next from '@visualdl/core/utils/i18n';
import nextI18NextMiddleware from '@visualdl/i18n/middleware'; import nextI18NextMiddleware from '@visualdl/i18n/middleware';
import path from 'path';
import {setConfig} from 'next/config'; import {setConfig} from 'next/config';
const isDev = process.env.NODE_ENV !== 'production'; const isDev = process.env.NODE_ENV === 'development';
setConfig(config);
const host = process.env.HOST || 'localhost'; const host = process.env.HOST || 'localhost';
const port = Number.parseInt(process.env.PORT || '', 10) || 8999; const port = Number.parseInt(process.env.PORT || '', 10) || 8999;
...@@ -17,12 +15,27 @@ const backend = process.env.BACKEND; ...@@ -17,12 +15,27 @@ const backend = process.env.BACKEND;
const delay = Number.parseInt(process.env.DELAY || '', 10); const delay = Number.parseInt(process.env.DELAY || '', 10);
const server = express(); const server = express();
const app = next({dev: isDev, conf: config});
const handle = app.getRequestHandler();
async function start() { async function start() {
setConfig(config);
const app = next({dev: isDev, conf: config});
const handle = app.getRequestHandler();
await app.prepare(); await app.prepare();
if (isDev) {
const {default: webpack} = await import('webpack');
const {default: webpackDevMiddleware} = await import('webpack-dev-middleware');
const {default: webpackConfig} = await import('./webpack.config');
const compiler = webpack(webpackConfig);
server.use(
webpackDevMiddleware(compiler, {
publicPath: '/'
})
);
}
if (backend) { if (backend) {
const {createProxyMiddleware} = await import('http-proxy-middleware'); const {createProxyMiddleware} = await import('http-proxy-middleware');
server.use(config.env.API_URL, createProxyMiddleware({target: backend, changeOrigin: true})); server.use(config.env.API_URL, createProxyMiddleware({target: backend, changeOrigin: true}));
...@@ -31,6 +44,7 @@ async function start() { ...@@ -31,6 +44,7 @@ async function start() {
server.use(config.env.API_URL, mock({delay: delay ? () => Math.random() * delay : 0})); server.use(config.env.API_URL, mock({delay: delay ? () => Math.random() * delay : 0}));
} }
const {default: nextI18Next} = await import('@visualdl/core/utils/i18n');
await nextI18Next.initPromise; await nextI18Next.initPromise;
server.use(nextI18NextMiddleware(nextI18Next)); server.use(nextI18NextMiddleware(nextI18Next));
...@@ -56,9 +70,15 @@ async function start() { ...@@ -56,9 +70,15 @@ async function start() {
} }
if (require.main === module) { if (require.main === module) {
const cwd = process.cwd();
const wd = path.dirname(require.resolve('@visualdl/core'));
process.chdir(wd);
process.on('exit', () => process.chdir(cwd));
process.on('uncaughtException', () => process.chdir(cwd));
process.on('unhandledRejection', () => process.chdir(cwd));
start(); start();
} }
export default start; export default start;
export {server, app}; export {server};
...@@ -23,8 +23,7 @@ ...@@ -23,8 +23,7 @@
"directory": "frontend/server" "directory": "frontend/server"
}, },
"scripts": { "scripts": {
"dev": "cross-env NODE_ENV=development nodemon --watch . --ext ts --exec \"ts-node index.ts\"", "dev": "cross-env NODE_ENV=development nodemon --watch index.ts --watch webpack.config.js --exec \"ts-node index.ts\"",
"dev:wasm": "cross-env WITH_WASM=1 yarn dev",
"build": "cross-env API_URL=/api ts-node build.ts", "build": "cross-env API_URL=/api ts-node build.ts",
"start": "pm2-runtime ecosystem.config.js", "start": "pm2-runtime ecosystem.config.js",
"test": "echo \"Error: no test specified\" && exit 0" "test": "echo \"Error: no test specified\" && exit 0"
...@@ -45,18 +44,21 @@ ...@@ -45,18 +44,21 @@
"pm2": "4.2.3" "pm2": "4.2.3"
}, },
"devDependencies": { "devDependencies": {
"@types/express": "4.17.4", "@types/express": "4.17.6",
"@types/node": "13.11.0", "@types/node": "13.11.1",
"@types/shelljs": "0.8.7", "@types/shelljs": "0.8.7",
"@types/webpack": "4.41.10",
"@types/webpack-dev-middleware": "3.7.0",
"@visualdl/mock": "^2.0.0-beta.32", "@visualdl/mock": "^2.0.0-beta.32",
"cross-env": "7.0.2", "cross-env": "7.0.2",
"nodemon": "2.0.2", "nodemon": "2.0.3",
"shelljs": "0.8.3", "shelljs": "0.8.3",
"ts-loader": "6.2.2", "ts-loader": "6.2.2",
"ts-node": "8.8.2", "ts-node": "8.8.2",
"typescript": "3.8.3", "typescript": "3.8.3",
"webpack": "4.42.1", "webpack": "4.42.1",
"webpack-cli": "3.3.11" "webpack-cli": "3.3.11",
"webpack-dev-middleware": "3.7.2"
}, },
"engines": { "engines": {
"node": ">=10", "node": ">=10",
......
...@@ -2,6 +2,7 @@ ...@@ -2,6 +2,7 @@
"compilerOptions": { "compilerOptions": {
"module": "commonjs", "module": "commonjs",
"target": "ES2018", "target": "ES2018",
"allowJs": true,
"skipLibCheck": true, "skipLibCheck": true,
"esModuleInterop": true, "esModuleInterop": true,
"declaration": true, "declaration": true,
......
import webpack from 'webpack';
declare const config: webpack.Configuration;
export default config;
...@@ -2,10 +2,9 @@ ...@@ -2,10 +2,9 @@
const path = require('path'); const path = require('path');
// TODO: add dev server
module.exports = { module.exports = {
mode: process.env.NODE_ENV === 'development' ? 'development' : 'production', mode: process.env.NODE_ENV === 'development' ? 'development' : 'production',
entry: './index.ts', entry: path.resolve(__dirname, './index.ts'),
output: { output: {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'index.js' filename: 'index.js'
......
# VisualDL FrontEnd Serverless
Serverless version of VisualDL pages.
This will generate static html pages that can be served by third party web servers such as Flask.
## Build
```bash
yarn build
```
...@@ -31,7 +31,7 @@ ...@@ -31,7 +31,7 @@
"test": "echo \"Error: no test specified\" && exit 0" "test": "echo \"Error: no test specified\" && exit 0"
}, },
"devDependencies": { "devDependencies": {
"@types/node": "13.11.0", "@types/node": "13.11.1",
"@types/rimraf": "3.0.0", "@types/rimraf": "3.0.0",
"@visualdl/core": "^2.0.0-beta.32", "@visualdl/core": "^2.0.0-beta.32",
"cross-env": "7.0.2", "cross-env": "7.0.2",
......
../../README.md
\ No newline at end of file
# VisualDL FrontEnd WASM
Web WebAssembly version of some parts of VisualDL.
## Development
If you want to develop wasm features, you must have [Rust](https://www.rust-lang.org/) and [Cargo](https://doc.rust-lang.org/cargo/) installed.
Using [rustup](https://rustup.rs/) to install them.
## Build
```base
yarn build
```
此差异已折叠。
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册