1.update roadhog to 3.x

.eslintrc

@@ -25,7 +25,16 @@
     "require-yield": [1],
     "no-plusplus": "off",
     "no-mixed-operators": "off",
-    "max-len": [0, 120]
+    "max-len": [0, 120],
+    "object-curly-newline": "off",
+    "padded-blocks": "off",
+    "function-paren-newline": "off",
+    "jsx-a11y/anchor-is-valid": "off",
+    "no-multi-assign": "off",
+    "no-await-in-loop": "off",
+    "prefer-destructuring": "off",
+    "react/require-default-props": "off",
+    "react/no-array-index-key": "off"
   },
   "parserOptions": {
     "ecmaFeatures": {

.roadhogrc.mock.js

-const oldRequire = require.extensions['.js'];
-const babelRegister = require('./babel-register');
-const babelRequire = require.extensions['.js'];
-require.extensions = (m, filename) => {
-  oldRequire(m, filename);
-  delete require.cache[filename];
-  return babelRequire(m, filename);
-};
 module.exports = require('./mock');
-babelRegister.unregister();

.storybook/config.js

 /* eslint-disable import/no-extraneous-dependencies, import/no-unresolved, import/extensions */
-import 'babel-polyfill';
+import '@babel/polyfill';
 import { configure } from '@storybook/react';
 
-function loadStories() {
-  require('../stories');
-}
-
-configure(loadStories, module);
+import('../stories').then((stories) => {
+  configure(stories, module);
+});

.storybook/middleware.js

@@ -4,7 +4,7 @@ const createProxy =  require('http-proxy-middleware');
 const _ = require('lodash');
 const assert = require('assert');
 
-const roadhog = require('../.roadhogrc');
+const roadhog = require('../.webpackrc');
 const mock = require('../.roadhogrc.mock');
 
 function parseKey(key) {

.storybook/webpack.config.js

-const genDefaultConfig = require('@storybook/react/dist/server/config/defaults/webpack.config.js');
-const path = require('path');
+const genDefaultConfig = require('@storybook/react/dist/server/config/defaults/webpack.config.js').default;
+const path = require('path').default;
 
 module.exports = (baseConfig, env) => {
   const config = genDefaultConfig(baseConfig, env);

.roadhogrc.js → .webpackrc.js

@@ -16,6 +16,9 @@ const resource_proxy = {
 
 module.exports = {
   "entry": "src/index.js",
+  "html": {
+    "template": "src/index.ejs",
+  },
   "theme": {
     "layout-header-height": "48px",
     "layout-header-background": "#fff",
@@ -24,13 +27,16 @@ module.exports = {
     'menu-dark-bg': '#404040',
     "layout-header-padding": "0",
   },
+  "ignoreMomentLocale": true,
+  "hash": true,
   "env": {
     "development": {
+      publicPath: "/",
       "extraBabelPlugins": [
         "dva-hmr",
-        "transform-runtime",
         ["import", { "libraryName": "antd", "style": true }]
       ],
+      "devtool": "cheap-module-eval-source-map",
       "proxy": {
         "/api": proxy,
         "/resource": resource_proxy,
@@ -43,9 +49,9 @@ module.exports = {
         apiContextPath: "/bm"
       },
       "extraBabelPlugins": [
-        "transform-runtime",
         ["import", { "libraryName": "antd", "style": true }]
-      ]
+      ],
+      "devtool": "hidden-source-map"
     }
   }
 };

mock.js

@@ -7,17 +7,6 @@ import toFilters from './src/mock/filter';
 const modules = genModules();
 const tasks = getTasks();
 
-const users = [
-  {
-    userId: 1,
-    userName: 'cxj',
-    tokenId: '12345-65432-abcdef',
-    expire: -1,
-  },
-];
-
-let currentUser = users[0];
-
 const domains = [
   {
     id: 1,
@@ -47,8 +36,7 @@ const getDomain = (id) => {
 };
 
 const dealWithData = (req) => {
-  const sort = req.query.sort;
-  const order = req.query.order;
+  const { sort, order } = req.query;
   const filters = [];
   for (const queryKey in req.query) {
     if (queryKey.indexOf('f-') === 0) {
@@ -114,7 +102,7 @@ module.exports = {
   },
   '/api/domain/all': wrapResponse(domains),
   '/api/domain/switch': (req, res) => {
-    const domainId = req.query.domainId;
+    const { domainId } = req.query;
     const intDomainId = parseInt(domainId, 10);
     const domainIds = domains.map(domain => domain.id);
     if (domainIds.indexOf(intDomainId) !== -1) {
@@ -136,7 +124,7 @@ module.exports = {
   },
   '/api/module/all/info': (req, res) => {
     console.log('/api/module/all/info');
-    const all = modules.all;
+    const { all } = modules;
     const publics = modules.public;
     const findModule = id => all.filter(m => m.id === id).pop();
     const fetchParent = (module) => {

package.json

 {
   "private": true,
   "scripts": {
-    "start": "roadhog server",
-    "build": "roadhog build",
+    "start": "roadhog dev",
+    "build": "cross-env ANALYZE=true roadhog build",
     "test": "roadhog test --require ./test_setup.js",
     "lint": "eslint --ext .js src test",
     "precommit": "npm run lint",
@@ -13,22 +13,20 @@
     "install-node": "6.9.2"
   },
   "dependencies": {
-    "antd": "^2.13.0",
+    "antd": "^2.13.11",
     "axo": "0.0.2",
-    "babel-plugin-import": "^1.2.1",
-    "babel-runtime": "^6.9.2",
     "bowser": "^1.8.1",
-    "bundle-loader": "^0.5.5",
-    "dva": "^1.2.1",
-    "dva-loading": "^0.2.1",
+    "dva": "^2.2.0-beta.2",
+    "dva-react-router-3": "^1.0.2",
+    "dva-loading": "^1.0.4",
     "fastjson_ref_resolver": "latest",
     "fingerprintjs": "^0.5.3",
     "lodash": "^4.17.4",
     "lowdb": "^1.0.0",
     "moment": "^2.18.1",
-    "prop-types": "^15.5.10",
-    "react": "^15.6.1",
-    "react-dom": "^15.6.1",
+    "prop-types": "^15.6.1",
+    "react": "^16.2.0",
+    "react-dom": "^16.2.0",
     "react-json-view": "^1.11.4",
     "react-sizeme": "^2.3.4",
     "resolve-pathname": "^2.1.0",
@@ -38,31 +36,23 @@
   },
   "devDependencies": {
     "@storybook/react": "^3.2.8",
-    "babel-eslint": "^7.1.1",
-    "babel-plugin-dva-hmr": "^0.3.2",
-    "babel-plugin-transform-runtime": "^6.9.0",
-    "babel-preset-es2016": "^6.24.1",
-    "babel-preset-es2017": "^6.24.1",
-    "babel-register": "^6.24.1",
+    "babel-plugin-dva-hmr": "^0.4.1",
+    "babel-plugin-import": "^1.6.5",
+    "babel-register": "^7.0.0-beta.3",
+    "bundle-loader": "^0.5.6",
     "chai": "^4.0.2",
-    "cross-env": "^5.0.1",
-    "ejs-loader": "^0.3.0",
-    "enzyme": "^2.9.1",
-    "eslint": "^3.12.2",
-    "eslint-config-airbnb": "^13.0.0",
-    "eslint-plugin-import": "^2.2.0",
-    "eslint-plugin-jsx-a11y": "^2.2.3",
-    "eslint-plugin-react": "^6.8.0",
-    "expect": "^1.20.2",
+    "cross-env": "^5.1.3",
+    "ejs-loader": "^0.3.1",
+    "enzyme": "^3.3.0",
+    "eslint-config-airbnb": "^16.1.0",
     "http-proxy-middleware": "^0.17.4",
-    "husky": "^0.12.0",
     "jsdom": "^11.0.0",
     "less": "^2.7.2",
     "less-loader": "^4.0.0",
     "mockjs": "^1.0.1-beta3",
     "path": "^0.12.7",
-    "react-test-renderer": "^15.6.1",
-    "redbox-react": "^1.3.2",
-    "roadhog": "^1.2.2"
+    "react-test-renderer": "^16.2.0",
+    "redbox-react": "^1.5.0",
+    "roadhog": "^2.3.0-beta.1"
   }
 }

src/components/table/input-table/index.js

@@ -59,20 +59,21 @@ class TableInput extends Component {
     const { items, form, children } = this.props;
     if (this.state.editing) {
       const fields = _.castArray(children)
-        .map((child, i) => {
-          const item = items[i];
-          return (
-            <Form.Item {...item}>
-              {
-                form.getFieldDecorator(item.name, item)(
-                  child,
-                )
-              }
-            </Form.Item>
-          );
-        },
-        this,
-      );
+        .map(
+          (child, i) => {
+            const item = items[i];
+            return (
+              <Form.Item {...item}>
+                {
+                  form.getFieldDecorator(item.name, item)(
+                    child,
+                  )
+                }
+              </Form.Item>
+            );
+          },
+          this,
+        );
       return (
         <div>
           {[

src/data/modules.js

@@ -46,7 +46,7 @@ const combineMenus = (menus1, menus2) => {
 export const getMenus = async () => {
   if (!data.flags.menus) {
     const context = require.context('../register/modules', true, /^.*\.(js|jsx|json)/);
-    const staticMenus = flatMap(context.keys(), context);
+    const staticMenus = flatMap(context.keys(), k => context(k).default);
     const dynamicMenus = await fetchMenus();
     data.menus = combineMenus(staticMenus, dynamicMenus);
     data.flags.menus = true;

src/index.ejs

@@ -4,7 +4,7 @@
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>Dva Demo</title>
-  <script src="https://cdn.bootcss.com/babel-polyfill/6.26.0/polyfill.min.js"></script>
+  <script src="https://cdn.bootcss.com/babel-polyfill/7.0.0-beta.3/polyfill.min.js"></script>
   <!--<link rel="stylesheet" href="/index.css" />-->
 </head>
 <body>

src/index.js

@@ -14,7 +14,7 @@ moment.locale('zh-cn');
 const app = dva({
   history,
   onError(error) {
-// eslint-disable-next-line no-console
+    // eslint-disable-next-line no-console
     processError(error);
   },
 });

src/models/login.js

-import { routerRedux } from 'dva/router';
+import { routerRedux } from 'dva-react-router-3/router';
 import { authorize, login, userInfo } from '../services/login';
 import { validate as passValidate } from '../services/login/password';
 import { requestCode, validate as ucaValidate } from '../services/login/uca';

src/models/main/index.js

-import { routerRedux } from 'dva/router';
+import { routerRedux } from 'dva-react-router-3/router';
 import { isString } from 'lodash';
 import { logout } from '../../services/main';
 import { fetchDomains, switchDomain, currentDomain } from '../../services/domain';

src/register/modules/empty.js

+/* eslint-disable */
 export default [/* {
   name: 'test-menu',
   showName: '测试',

src/router.js

 import React from 'react';
 import PropTypes from 'prop-types';
-import { Router } from 'dva/router';
-import _ from 'lodash';
+import { Router } from 'dva-react-router-3/router';
+import { isString } from 'lodash';
 import config from './utils/config';
 import { isAuthed, hasDomain, histories } from './utils/auth';
 import { fullPath, makePromise0 } from './utils/helper';
@@ -75,7 +75,7 @@ const createRoutes = async (app, modules, groups, basePath) => {
     for (const module of modules) {
       let info;
       let layout;
-      if (_.isString(module)) {
+      if (isString(module)) {
         info = await getModuleInfo(module);
         layout = await getModuleLayout(module);
       } else {
@@ -89,13 +89,15 @@ const createRoutes = async (app, modules, groups, basePath) => {
         name: showName,
       };
       if (layout.route) {
-        const modelBundle = await makePromise0(require('bundle!./models/main/modules/' + layout.route + '/index.js')); // eslint-disable-line import/no-dynamic-require, prefer-template, global-require
+        const modelBundle = await makePromise0(require('bundle-loader!./models/main/modules/' + layout.route + '/index.js').default); // eslint-disable-line import/no-dynamic-require, prefer-template, global-require
         registerModel(app, modelBundle);
-        const routeBundle = await makePromise0(require('bundle!./routes/main/modules/' + layout.route + '/index.js')); // eslint-disable-line import/no-dynamic-require, prefer-template, global-require
+        const routeBundle = await makePromise0(require('bundle-loader!./routes/main/modules/' + layout.route + '/index.js').default); // eslint-disable-line import/no-dynamic-require, prefer-template, global-require
         route.component = routeBundle;
         if (routeBundle.route) {
           for (const key in routeBundle.route) {
+            // noinspection JSUnfilteredForInLoop
             if ({}.hasOwnProperty.call(routeBundle.route, key)) {
+              // noinspection JSUnfilteredForInLoop
               route[key] = routeBundle.route[key];
             }
           }
@@ -176,8 +178,8 @@ function RouterConfig({ history, app }) {
           path: 'login',
           getComponent(ignored, cb) {
             require.ensure([], (require) => {
-              registerModel(app, require('./models/login'));
-              cb(null, require('./routes/login'));
+              registerModel(app, require('./models/login').default);
+              cb(null, require('./routes/login').default);
             }, 'login');
           },
         },
@@ -188,8 +190,8 @@ function RouterConfig({ history, app }) {
           },
           getComponent(ignored, cb) {
             require.ensure([], (require) => {
-              registerModel(app, require('./models/domain'));
-              cb(null, require('./routes/domain'));
+              registerModel(app, require('./models/domain').default);
+              cb(null, require('./routes/domain').default);
             }, 'domain');
           },
         },
@@ -200,8 +202,8 @@ function RouterConfig({ history, app }) {
           },
           getComponent(ignored, cb) {
             require.ensure([], (require) => {
-              registerModel(app, require('./models/main'));
-              cb(null, require('./routes/main'));
+              registerModel(app, require('./models/main').default);
+              cb(null, require('./routes/main').default);
             }, 'main');
           },
           getChildRoutes: (nextState, cb) => {
@@ -231,8 +233,8 @@ function RouterConfig({ history, app }) {
       },
       getComponent(ignored, cb) {
         require.ensure([], (require) => {
-          registerModel(app, require('./models/main/modules/' + config.fastNavigationPage)); // eslint-disable-line import/no-dynamic-require, prefer-template
-          cb(null, require('./routes/main/modules/' + config.fastNavigationPage)); // eslint-disable-line import/no-dynamic-require, prefer-template
+          registerModel(app, require('./models/main/modules/' + config.fastNavigationPage).default); // eslint-disable-line import/no-dynamic-require, prefer-template
+          cb(null, require('./routes/main/modules/' + config.fastNavigationPage).default); // eslint-disable-line import/no-dynamic-require, prefer-template
         }, 'fastNav');
       },
     });
@@ -243,8 +245,8 @@ function RouterConfig({ history, app }) {
 }
 
 RouterConfig.propTypes = {
-  history: PropTypes.object,
-  app: PropTypes.object,
+  history: PropTypes.object.isRequired,
+  app: PropTypes.object.isRequired,
 };
 
 export default RouterConfig;

src/routes/login/index.js

@@ -115,7 +115,7 @@ class LoginForm extends React.Component {
 
   render() {
     const { getFieldDecorator } = this.props.form;
-    const loading = this.props.loading;
+    const { loading } = this.props;
     return (
       <div className={styles.canvas}>
         <div className={styles.container}>

src/routes/main/header.js

@@ -2,7 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { Menu, Breadcrumb, Icon } from 'antd';
 import { connect } from 'dva';
-import { Link } from 'dva/router';
+import { Link } from 'dva-react-router-3/router';
 import styles from './header.less';
 
 const SubMenu = Menu.SubMenu;

src/routes/main/index.js

 import React from 'react';
 import PropTypes from 'prop-types';
 import { connect } from 'dva';
-import { withRouter } from 'dva/router';
+import { withRouter } from 'dva-react-router-3/router';
 import { Layout } from 'antd';
 import SiderLogo from '../../components/layout/sider/SiderLogo';
 import SiderMenu from '../../components/layout/sider/SiderMenu';
@@ -76,7 +76,7 @@ class Main extends React.Component {
 
 Main.propTypes = {
   children: PropTypes.element,
-  main: PropTypes.object.isRequired,
+  main: PropTypes.object,
 };
 
 export default connect(({ main }) => ({ main }))(withRouter(Main));

src/routes/main/modules/task/index.js

 import { connect } from 'dva';
-import { withRouter } from 'dva/router';
+import { withRouter } from 'dva-react-router-3/router';
 import List from './list';
 import Detail from './detail';
 import route from '../../../../components/hoc/routes';

src/services/route.js

-import { browserHistory } from 'dva/router';
+import { browserHistory } from 'dva-react-router-3/router';
 import resolvePathname from 'resolve-pathname';
 import { isString } from 'lodash';
 import config from '../utils/config';

src/utils/helper.js

@@ -88,7 +88,7 @@ export function encrypt(text) {
  */
 export function queryURL(name) {
   const reg = new RegExp(`(^|&)${name}=([^&]*)(&|$)`, 'i');
-// eslint-disable-next-line no-undef
+  // eslint-disable-next-line no-undef
   const r = window ? window.location.search.substr(1).match(reg) : null;
   if (r !== null) return decodeURI(r[2]);
   return null;
@@ -101,7 +101,7 @@ export function padDigits(number, digits) {
 export function is(obj, type) {
   return (type === 'Null' && obj === null) ||
     (type === 'Undefined' && obj === void 0) || // eslint-disable-line no-void
-    (type === 'Number' && isFinite(obj)) ||
+    (type === 'Number' && Number.isFinite(obj)) ||
     Object.prototype.toString.call(obj).slice(8, -1) === type;
 }
 

src/utils/polyfill.js

 /* eslint-disable */
-
 export const fetch = require('dva/fetch');

webpack.config.js

-module.exports = function (config) {
+module.exports = function webpack(config) {
   config.module.rules.push({
     test: /\.ejs$/,
     loader: 'ejs-loader',