refactor: get rid of webpack & nextjs while introducing es module

Dockerfile.demo

@@ -8,7 +8,7 @@ RUN ["pip", "install", "--disable-pip-version-check", "-r", "requirements.txt"]
 RUN ["python", "setup.py", "bdist_wheel"]
 RUN ["pip", "install", "--disable-pip-version-check", "--find-links=dist", "visualdl"]
 
-WORKDIR frontend
+WORKDIR /home/visualdl/frontend
 ENV SCOPE server
 ENV PUBLIC_PATH /paddle/visualdl/demo
 ENV API_URL /paddle/visualdl/demo/api

frontend/.eslintrc.js

@@ -9,20 +9,14 @@ module.exports = {
         ecmaVersion: 2018,
         sourceType: 'module'
     },
-    ignorePatterns: ['node_modules/', 'dist/', 'output/', '_next'],
+    ignorePatterns: ['node_modules/', 'dist/', 'output/'],
     rules: {
         'no-console': 'warn',
         'sort-imports': 'error'
     },
     overrides: [
         {
-            files: [
-                'packages/cli/**/*',
-                'packages/mock/**/*',
-                'packages/demo/**/*',
-                'packages/server/**/*',
-                'packages/serverless/**/*'
-            ],
+            files: ['packages/cli/**/*', 'packages/mock/**/*', 'packages/demo/**/*', 'packages/server/**/*'],
             extends: [
                 'plugin:@typescript-eslint/recommended',
                 'prettier/@typescript-eslint',
@@ -36,7 +30,7 @@ module.exports = {
             }
         },
         {
-            files: ['packages/core/**/*', 'packages/i18n/**/*'],
+            files: ['packages/core/**/*'],
             extends: [
                 'plugin:@typescript-eslint/recommended',
                 'plugin:react/recommended',

frontend/.huskyrc

@@ -0,0 +1,5 @@
+{
+    "hooks": {
+        "pre-commit": "lint-staged"
+    }
+}

frontend/README.md

@@ -59,9 +59,8 @@ yarn
 
 [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)
+[netron](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/packages/netron/README.md)
 [cli](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/packages/cli/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)
 

frontend/README_cn.md

@@ -59,9 +59,8 @@ yarn
 
 [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)
+[netron](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/packages/netron/README.md)
 [cli](https://github.com/PaddlePaddle/VisualDL/blob/develop/frontend/packages/cli/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)
 

frontend/lint-staged.config.js

@@ -1,18 +1,18 @@
 const path = require('path');
 const fs = require('fs');
 
+const getPackages = filenames => [
+    ...new Set(filenames.map(filename => path.relative(path.join(__dirname, 'packages'), filename).split(path.sep)[0]))
+];
+
 module.exports = {
     // lint all files when global package.json or eslint config changes.
     './(package.json|.eslintrc.js)': () =>
         `eslint --ext .tsx,.jsx.ts,.js --ignore-path ${path.join(__dirname, '.gitignore')} ${__dirname}`,
 
     // check types when ts file or package.json changes.
     './(packages/*/package.json|packages/*/**/*.ts?(x))': filenames =>
-        [
-            ...new Set(
-                filenames.map(filename => path.relative(path.join(__dirname, 'packages'), filename).split(path.sep)[0])
-            )
-        ]
+        getPackages(filenames)
             .map(p => path.join(__dirname, 'packages', p, 'tsconfig.json'))
             .filter(p => {
                 try {
@@ -26,6 +26,15 @@ module.exports = {
     // lint changed files
     '**/*.(j|t)s?(x)': filenames => [
         `eslint ${filenames.join(' ')}`,
-        `yarn test --silent --bail --findRelatedTests ${filenames.join(' ')}`
+        ...getPackages(filenames).map(p => {
+            const filename = path.join(__dirname, 'packages', p, 'package.json');
+            const packageFile = JSON.parse(fs.readFileSync(filename, 'utf-8'));
+            if (packageFile.scripts.test === 'jest') {
+                return `yarn workspace @visualdl/${p} run test --silent --bail --findRelatedTests ${filenames.join(
+                    ' '
+                )}`;
+            }
+            return `yarn workspace @visualdl/${p} run test`;
+        })
     ]
 };

frontend/package.json

@@ -29,29 +29,29 @@
     "scripts": {
         "bootstrap": "lerna bootstrap",
         "build": "./scripts/build.sh",
-        "clean": "rimraf output *.log packages/*/dist packages/core/out packages/wasm/target packages/*/*.log",
+        "clean": "rimraf output packages/*/dist packages/wasm/target",
         "lint": "eslint --ext .tsx,.jsx.ts,.js --ignore-path .gitignore .",
-        "format": "prettier --write \"**/*.ts\" \"**/*.tsx\" \"**/*.js\"",
+        "format": "prettier --write \"**/*.{ts,tsx,js,jsx}\"",
         "test": "yarn workspaces run test",
         "prepublishOnly": "yarn lint && yarn test && yarn build",
         "preversion": "yarn lint",
         "version": "yarn format && git add -A"
     },
     "devDependencies": {
-        "@typescript-eslint/eslint-plugin": "3.8.0",
-        "@typescript-eslint/parser": "3.8.0",
-        "eslint": "7.6.0",
+        "@typescript-eslint/eslint-plugin": "4.0.1",
+        "@typescript-eslint/parser": "4.0.1",
+        "eslint": "7.8.1",
         "eslint-config-prettier": "6.11.0",
         "eslint-plugin-prettier": "3.1.4",
-        "eslint-plugin-react": "7.20.5",
-        "eslint-plugin-react-hooks": "4.0.8",
+        "eslint-plugin-react": "7.20.6",
+        "eslint-plugin-react-hooks": "4.1.0",
         "husky": "4.2.5",
         "lerna": "3.22.1",
-        "lint-staged": "10.2.11",
-        "prettier": "2.0.5",
+        "lint-staged": "10.2.13",
+        "prettier": "2.1.1",
         "rimraf": "3.0.2",
-        "typescript": "3.9.7",
-        "yarn": "1.22.4"
+        "typescript": "4.0.2",
+        "yarn": "1.22.5"
     },
     "engines": {
         "node": ">=10",

frontend/packages/cli/package.json

@@ -23,10 +23,10 @@
         "directory": "frontend/packages/cli"
     },
     "scripts": {
-        "dev": "cross-env NODE_ENV=development ts-node index.ts",
         "build": "tsc",
+        "dev": "cross-env NODE_ENV=development ts-node index.ts",
         "start": "node index.js",
-        "test": "echo \"Error: no test specified\" && exit 0; #"
+        "test": "echo \"Error: no test specified\" && exit 0"
     },
     "bin": "dist/index.js",
     "types": "dist/index.d.ts",
@@ -35,28 +35,23 @@
     ],
     "dependencies": {
         "@visualdl/server": "2.0.0",
-        "open": "7.1.0",
-        "ora": "4.0.5",
-        "pm2": "4.4.0",
+        "open": "7.2.1",
+        "ora": "5.0.0",
+        "pm2": "4.4.1",
         "yargs": "15.4.1"
     },
     "devDependencies": {
-        "@types/node": "14.0.27",
+        "@types/node": "14.6.3",
         "@types/yargs": "15.0.5",
         "cross-env": "7.0.2",
-        "ts-node": "8.10.2",
-        "typescript": "3.9.7"
+        "ts-node": "9.0.0",
+        "typescript": "4.0.2"
     },
     "engines": {
-        "node": ">=10",
+        "node": ">=12",
         "npm": ">=6"
     },
     "publishConfig": {
         "access": "public"
-    },
-    "husky": {
-        "hooks": {
-            "pre-commit": "lint-staged"
-        }
     }
 }

frontend/packages/core/README.md

@@ -1,7 +1,6 @@
 # VisualDL FrontEnd Core
 
 This is core contents of VisualDL pages.
-DO NOT use it directly.
 
 ## Development
 
@@ -12,9 +11,3 @@ 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/babel.config.js

@@ -1,15 +1,4 @@
 module.exports = {
-    presets: ['next/babel'],
-    plugins: [
-        [
-            'styled-components',
-            {
-                ssr: true,
-                displayName: true,
-                preprocess: false
-            }
-        ],
-        ['emotion'],
-        ...(process.env.NODE_ENV !== 'production' ? ['typescript-to-proptypes'] : [])
-    ]
+    extends: '@snowpack/app-scripts-react/babel.config.json',
+    plugins: ['styled-components']
 };

frontend/packages/core/builder/dev-server.js

@@ -0,0 +1,24 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
+
+const express = require('express');
+const mock = require('./mock');
+const icons = require('./icons');
+const netron = require('./netron');
+const wasm = require('./wasm');
+
+const argv = require('yargs').nargs('port', 1).number('port').nargs('host', 1).argv;
+
+const app = express();
+
+app.use(mock.pathname, mock.middleware());
+
+app.use(icons.pathname, icons.middleware());
+
+app.use(netron.pathname, express.static(netron.root, {index: false}));
+
+app.get(`${wasm.pathname}/${wasm.out}`, (_req, res) => {
+    res.type('application/wasm');
+    res.sendFile(wasm.source);
+});
+
+app.listen(argv.port, argv.host);

frontend/packages/core/builder/environment.js

@@ -0,0 +1,7 @@
+process.env.SNOWPACK_PUBLIC_PATH =
+    process.env.PUBLIC_PATH === '/' || !process.env.PUBLIC_PATH ? '' : process.env.PUBLIC_PATH;
+process.env.SNOWPACK_PUBLIC_API_URL = process.env.API_URL || `${process.env.SNOWPACK_PUBLIC_PATH}/api`;
+process.env.SNOWPACK_PUBLIC_TELEMETRY_ID = process.env.TELEMETRY_ID || '';
+process.env.SNOWPACK_PUBLIC_API_TOKEN_KEY = process.env.API_TOKEN_KEY || '';
+process.env.SNOWPACK_PUBLIC_LANGUAGES = process.env.LANGUAGES || 'en,zh';
+process.env.SNOWPACK_PUBLIC_DEFAULT_LANGUAGE = process.env.DEFAULT_LANGUAGE || 'en';