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

frontend/README.md

 <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>
 <br />
 
 <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://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://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/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/stargazers"><img src="https://img.shields.io/github/stars/PaddlePaddle/VisualDL?style=social" alt="GitHub stars" /></a>
 </p>
@@ -18,29 +17,23 @@
 
 English | [简体中文](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/README_cn.md)
 
-**🚧UNDER DEVELOPMENT🚧**
-
-**🚧SOME FEATURE MAY NOT WORK PROPERLY🚧**
-
-**🚧PULL REQUESTS WELCOMED🚧**
-
 ## Usage
 
 > nodejs ≥ 10 and npm ≥ 6 are required.
 
 ```bash
-npm install -g visualdl
+npm install -g @visualdl/cli
 # 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
 visualdl start --backend="http://127.0.0.1:8040"
 ```
 
-To stop visualdl server, just type
+To stop VisualDL server, just type
 
 ```bash
 visualdl stop
@@ -54,53 +47,60 @@ visualdl -h
 
 ## Development
 
-First, install all dependencies:
-
 ```bash
-npm install
+npm install && npm run bootstrap
 # or
 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
-yarn dev
-```
+## Packages
 
-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
-PORT=3000 yarn dev
-```
+> We only support building on Linux/MacOS now.
 
-### 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
-yarn dev:wasm
+npm install --production
 ```
 
-## Build & Deploy
+Then use:
 
 ```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
 

frontend/README_cn.md

 <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>
 <br />
 
 <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://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://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/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/stargazers"><img src="https://img.shields.io/github/stars/PaddlePaddle/VisualDL?style=social" alt="GitHub stars" /></a>
 </p>
@@ -18,64 +17,91 @@
 
 [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
-npm install
-# 或者
-yarn
+visualdl stop
 ```
 
-之后可以启动开发服务：
+更多详情：
 
 ```bash
-yarn dev
+visualdl -h
 ```
 
-现在可以用浏览器打开 [http://localhost:8999](http://localhost:8999) 。
-
-你可以使用 `PORT` 环境变量更改服务的端口：
+## 开发
 
 ```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
-yarn dev:wasm
+yarn build
 ```
 
-## 编译和部署
+你会在 `output` 文件夹中得到 `server.tar.gz` 和 `serverless.tar.gz`。
+
+### Server 部署
+
+> 要求 nodejs ≥ 10 并且 npm ≥ 6
+
+解压 `server.tar.gz` 到任何地方。
+`cd` 到那个文件夹然后运行：
 
 ```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/) 也许可以工作但是并未经过测试。

frontend/lint-staged.config.js

 const path = require('path');
+const fs = require('fs');
 
 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(
                 filenames.map(
                     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(' ')}`
 };

frontend/package.json

@@ -27,6 +27,7 @@
         "directory": "frontend"
     },
     "scripts": {
+        "bootstrap": "lerna bootstrap",
         "build": "./scripts/build.sh",
         "clean": "rimraf output */dist wasm/target",
         "lint": "eslint --ext .tsx,.jsx.ts,.js --ignore-path .gitignore .",
@@ -44,9 +45,9 @@
         "eslint-plugin-prettier": "3.1.2",
         "eslint-plugin-react": "7.19.0",
         "eslint-plugin-react-hooks": "3.0.0",
-        "husky": "4.2.3",
+        "husky": "4.2.5",
         "lerna": "^3.20.2",
-        "lint-staged": "10.1.2",
+        "lint-staged": "10.1.3",
         "prettier": "2.0.4",
         "rimraf": "3.0.2",
         "typescript": "3.8.3",

frontend/packages/app/README.md

+# VisualDL FrontEnd APP
+
+UNDER DEVELOPMENT

frontend/packages/cli/README.md

+# 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
+```

frontend/packages/cli/package.json

@@ -41,7 +41,7 @@
         "yargs": "15.3.1"
     },
     "devDependencies": {
-        "@types/node": "13.11.0",
+        "@types/node": "13.11.1",
         "@types/yargs": "15.0.4",
         "cross-env": "7.0.2",
         "ts-node": "8.8.2",

frontend/packages/core/README.md

+# 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
+```

frontend/packages/core/package.json

@@ -61,19 +61,18 @@
         "@types/dagre-d3": "0.4.39",
         "@types/echarts": "4.4.5",
         "@types/lodash": "4.14.149",
-        "@types/node": "13.11.0",
+        "@types/node": "13.11.1",
         "@types/nprogress": "0.2.0",
-        "@types/react": "16.9.32",
+        "@types/react": "16.9.34",
         "@types/react-dom": "16.9.6",
         "@types/styled-components": "5.0.1",
-        "@types/webpack": "4.41.10",
         "@visualdl/mock": "^2.0.0-beta.32",
         "babel-plugin-emotion": "10.0.33",
         "babel-plugin-styled-components": "1.10.7",
         "babel-plugin-typescript-to-proptypes": "1.3.2",
-        "core-js": "3.6.4",
+        "core-js": "3.6.5",
         "cross-env": "7.0.2",
-        "css-loader": "3.5.1",
+        "css-loader": "3.5.2",
         "ora": "4.0.3",
         "typescript": "3.8.3",
         "worker-plugin": "4.0.2"

frontend/packages/i18n/README.md

+# 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
+```

frontend/packages/i18n/package.json

@@ -37,7 +37,7 @@
     "dependencies": {
         "detect-node": "2.0.4",
         "hoist-non-react-statics": "3.3.2",
-        "i18next": "19.3.4",
+        "i18next": "19.4.1",
         "i18next-browser-languagedetector": "4.0.2",
         "i18next-express-middleware": "1.9.1",
         "i18next-node-fs-backend": "2.1.3",
@@ -48,10 +48,10 @@
         "url": "0.11.0"
     },
     "devDependencies": {
-        "@types/express": "4.17.4",
+        "@types/express": "4.17.6",
         "@types/hoist-non-react-statics": "3.3.1",
-        "@types/node": "13.11.0",
-        "@types/react": "16.9.32",
+        "@types/node": "13.11.1",
+        "@types/react": "16.9.34",
         "@types/react-dom": "16.9.6",
         "typescript": "3.8.3"
     },

frontend/packages/mock/README.md

+# VisualDL FrontEnd Mock
+
+Mock data for development.
+
+## Build
+
+```bash
+yarn build
+```

frontend/packages/mock/data/images/image.ts

@@ -11,7 +11,7 @@ const images = [
 ];
 
 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]);
     if (result.headers.has('Content-Type')) {
         res.type(result.headers.get('Content-Type') as string);

frontend/packages/mock/index.ts

@@ -16,7 +16,11 @@ export default (options: Options) => {
     return async (req: Request, res: Response) => {
         let method = req.path;
         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 {
             method = method.replace(/^\//, '');
         }

frontend/packages/mock/package.json

@@ -36,9 +36,9 @@
         "isomorphic-unfetch": "3.0.0"
     },
     "devDependencies": {
-        "@types/express": "4.17.4",
+        "@types/express": "4.17.6",
         "@types/faker": "4.1.11",
-        "@types/node": "13.11.0",
+        "@types/node": "13.11.1",
         "typescript": "3.8.3"
     },
     "peerDependencies": {

frontend/packages/server/README.md

+# VisualDL FrontEnd Server
+
+Serve VisualDL pages by NodeJS with SSR.
+
+## Development
+
+```bash
+yarn dev
+```
+
+## Build
+
+```bash
+yarn build
+```
+
+## Start
+
+```bash
+yarn start
+```

frontend/packages/server/index.ts

@@ -3,13 +3,11 @@
 import config from '@visualdl/core/next.config';
 import express from 'express';
 import next from 'next';
-import nextI18Next from '@visualdl/core/utils/i18n';
 import nextI18NextMiddleware from '@visualdl/i18n/middleware';
+import path from 'path';
 import {setConfig} from 'next/config';
 
-const isDev = process.env.NODE_ENV !== 'production';
-
-setConfig(config);
+const isDev = process.env.NODE_ENV === 'development';
 
 const host = process.env.HOST || 'localhost';
 const port = Number.parseInt(process.env.PORT || '', 10) || 8999;
@@ -17,12 +15,27 @@ const backend = process.env.BACKEND;
 const delay = Number.parseInt(process.env.DELAY || '', 10);
 
 const server = express();
-const app = next({dev: isDev, conf: config});
-const handle = app.getRequestHandler();
 
 async function start() {
+    setConfig(config);
+    const app = next({dev: isDev, conf: config});
+    const handle = app.getRequestHandler();
+
     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) {
         const {createProxyMiddleware} = await import('http-proxy-middleware');
         server.use(config.env.API_URL, createProxyMiddleware({target: backend, changeOrigin: true}));
@@ -31,6 +44,7 @@ async function start() {
         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;
     server.use(nextI18NextMiddleware(nextI18Next));
 
@@ -56,9 +70,15 @@ async function start() {
 }
 
 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();
 }
 
 export default start;
 
-export {server, app};
+export {server};

frontend/packages/server/package.json

@@ -23,8 +23,7 @@
         "directory": "frontend/server"
     },
     "scripts": {
-        "dev": "cross-env NODE_ENV=development nodemon --watch . --ext ts --exec \"ts-node index.ts\"",
-        "dev:wasm": "cross-env WITH_WASM=1 yarn dev",
+        "dev": "cross-env NODE_ENV=development nodemon --watch index.ts --watch webpack.config.js --exec \"ts-node index.ts\"",
         "build": "cross-env API_URL=/api ts-node build.ts",
         "start": "pm2-runtime ecosystem.config.js",
         "test": "echo \"Error: no test specified\" && exit 0"
@@ -45,18 +44,21 @@
         "pm2": "4.2.3"
     },
     "devDependencies": {
-        "@types/express": "4.17.4",
-        "@types/node": "13.11.0",
+        "@types/express": "4.17.6",
+        "@types/node": "13.11.1",
         "@types/shelljs": "0.8.7",
+        "@types/webpack": "4.41.10",
+        "@types/webpack-dev-middleware": "3.7.0",
         "@visualdl/mock": "^2.0.0-beta.32",
         "cross-env": "7.0.2",
-        "nodemon": "2.0.2",
+        "nodemon": "2.0.3",
         "shelljs": "0.8.3",
         "ts-loader": "6.2.2",
         "ts-node": "8.8.2",
         "typescript": "3.8.3",
         "webpack": "4.42.1",
-        "webpack-cli": "3.3.11"
+        "webpack-cli": "3.3.11",
+        "webpack-dev-middleware": "3.7.2"
     },
     "engines": {
         "node": ">=10",

frontend/packages/server/tsconfig.json

@@ -2,6 +2,7 @@
     "compilerOptions": {
         "module": "commonjs",
         "target": "ES2018",
+        "allowJs": true,
         "skipLibCheck": true,
         "esModuleInterop": true,
         "declaration": true,

frontend/packages/server/webpack.config.d.ts

+import webpack from 'webpack';
+declare const config: webpack.Configuration;
+export default config;

frontend/packages/server/webpack.config.js

@@ -2,10 +2,9 @@
 
 const path = require('path');
 
-// TODO: add dev server
 module.exports = {
     mode: process.env.NODE_ENV === 'development' ? 'development' : 'production',
-    entry: './index.ts',
+    entry: path.resolve(__dirname, './index.ts'),
     output: {
         path: path.resolve(__dirname, 'dist'),
         filename: 'index.js'

frontend/packages/serverless/README.md

+# 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
+```

frontend/packages/serverless/package.json

@@ -31,7 +31,7 @@
         "test": "echo \"Error: no test specified\" && exit 0"
     },
     "devDependencies": {
-        "@types/node": "13.11.0",
+        "@types/node": "13.11.1",
         "@types/rimraf": "3.0.0",
         "@visualdl/core": "^2.0.0-beta.32",
         "cross-env": "7.0.2",

frontend/packages/wasm/README.md

-../../README.md
\ No newline at end of file

frontend/packages/wasm/README.md

+# 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
+```