upgrade umi@3 partly

.umirc.js

@@ -1,76 +1,53 @@
 // https://umijs.org/config/
 import { resolve } from 'path'
 import { i18n } from './src/utils/config'
+const fs = require('fs')
+const path = require('path')
+const lessToJs = require('less-vars-to-js')
 
 export default {
   publicPath: 'https://cdn.antd-admin.zuiidea.com/',
   hash: true,
   ignoreMomentLocale: true,
   targets: { ie: 9 },
-  treeShaking: true,
-  plugins: [
-    [
-      // https://umijs.org/plugin/umi-plugin-react.html
-      'umi-plugin-react',
-      {
-        dva: { immer: true },
-        antd: true,
-        dynamicImport: {
-          webpackChunkName: true,
-          loadingComponent: './components/Loader/Loader',
-        },
-        routes: {
-          exclude: [
-            /model\.(j|t)sx?$/,
-            /service\.(j|t)sx?$/,
-            /models\//,
-            /components\//,
-            /services\//,
-            /chart\/Container\.js$/,
-            /chart\/ECharts\/.+Component\.js$/,
-            /chart\/ECharts\/.+ComPonent\.js$/,
-            /chart\/ECharts\/theme\/.+\.js$/,
-            /chart\/highCharts\/.+Component\.js$/,
-            /chart\/highCharts\/mapdata\/.+\.js$/,
-            /chart\/Recharts\/.+Component\.js$/,
-            /chart\/Recharts\/Container\.js$/,
-          ],
-          update: routes => {
-            if (!i18n) return routes
+  dva: { immer: true },
+  antd: {},
+  dynamicImport: {
+    loading: 'components/Loader/Loader'
+  },
+  // TODO: routes need to be array
+  // routes: {
+  //   update: routes => {
+  //     if (!i18n) return routes
 
-            const newRoutes = []
-            for (const item of routes[0].routes) {
-              newRoutes.push(item)
-              if (item.path) {
-                newRoutes.push(
-                  Object.assign({}, item, {
-                    path:
-                      `/:lang(${i18n.languages
-                        .map(item => item.key)
-                        .join('|')})` + item.path,
-                  })
-                )
-              }
-            }
-            routes[0].routes = newRoutes
+  //     const newRoutes = []
+  //     for (const item of routes[0].routes) {
+  //       newRoutes.push(item)
+  //       if (item.path) {
+  //         newRoutes.push(
+  //           Object.assign({}, item, {
+  //             path:
+  //               `/:lang(${i18n.languages
+  //                 .map(item => item.key)
+  //                 .join('|')})` + item.path,
+  //           })
+  //         )
+  //       }
+  //     }
+  //     routes[0].routes = newRoutes
 
-            return routes
-          },
-        },
-        dll: {
-          include: ['dva', 'dva/router', 'dva/saga', 'dva/fetch', 'antd/es'],
-        },
-        pwa: {
-          manifestOptions: {
-            srcPath: 'manifest.json',
-          },
-        },
-      },
-    ],
-  ],
+  //     return routes
+  //   },
+  // },
+  // not support in umi@3
+  // pwa: {
+  //   manifestOptions: {
+  //     srcPath: 'manifest.json',
+  //   },
+  // },
   // Theme for antd
   // https://ant.design/docs/react/customize-theme
-  theme: './config/theme.config.js',
+  theme: lessToJs(fs.readFileSync(path.join(__dirname, './src/themes/default.less'), 'utf8')),
   // Webpack Configuration
   proxy: {
     '/api/v1/weather': {
@@ -101,7 +78,7 @@ export default {
       'lodash',
     ],
   ],
-  chainWebpack: function(config, { webpack }) {
+  chainWebpack: function (config, { webpack }) {
     config.merge({
       optimization: {
         minimize: true,

package.json

@@ -4,7 +4,7 @@
   "license": "MIT",
   "description": "An admin dashboard application demo built upon Ant Design and UmiJS",
   "dependencies": {
-    "@ant-design/compatible": "^0.0.1-rc.1",
+    "@ant-design/compatible": "^1.0.0",
     "@ant-design/icons": "^4.0.0",
     "@lingui/react": "^2.8.0",
     "ant-design-pro": "^2.3.0",
@@ -43,6 +43,7 @@
     "@lingui/babel-preset-react": "^2.8.2",
     "@lingui/cli": "^2.8.2",
     "@lingui/loader": "^2.8.2",
+    "@umijs/preset-react": "^1.3.7",
     "babel-core": "7.0.0-bridge.0",
     "babel-eslint": "^10.0.1",
     "babel-plugin-dev-expression": "^0.2.1",
@@ -66,8 +67,7 @@
     "stylelint": "^13.0.0",
     "stylelint-config-prettier": "^8.0.0",
     "stylelint-config-standard": "^20.0.0",
-    "umi": "^2.13.0",
-    "umi-plugin-react": "^1.15.0"
+    "umi": "^3.0.0"
   },
   "engines": {
     "node": ">= 10.0.0"

src/components/Layout/Bread.js

@@ -1,8 +1,7 @@
 import React, { PureComponent, Fragment } from 'react'
 import PropTypes from 'prop-types'
 import { Breadcrumb } from 'antd'
-import Link from 'umi/navlink'
-import withRouter from 'umi/withRouter'
+import { Link, withRouter } from 'umi'
 import { Icon as LegacyIcon } from '@ant-design/compatible'
 import { withI18n } from '@lingui/react'
 import { pathMatchRegexp, queryAncestors, addLangPrefix } from 'utils'

src/components/Layout/Menu.js

@@ -2,8 +2,7 @@ import React, { PureComponent, Fragment } from 'react'
 import PropTypes from 'prop-types'
 import { Icon as LegacyIcon } from '@ant-design/compatible'
 import { Menu } from 'antd'
-import Navlink from 'umi/navlink'
-import withRouter from 'umi/withRouter'
+import { NavLink, withRouter } from 'umi'
 import {
   arrayToTree,
   queryAncestors,
@@ -58,10 +57,10 @@ class SiderMenu extends PureComponent {
       }
       return (
         <Menu.Item key={item.id}>
-          <Navlink to={addLangPrefix(item.route) || '#'}>
+          <NavLink to={addLangPrefix(item.route) || '#'}>
             {item.icon && <LegacyIcon type={item.icon} />}
             <span>{item.name}</span>
-          </Navlink>
+          </NavLink>
         </Menu.Item>
       )
     })

src/layouts/BaseLayout.js

@@ -6,7 +6,7 @@ import { Loader } from 'components'
 import { queryLayout } from 'utils'
 import NProgress from 'nprogress'
 import config from 'utils/config'
-import withRouter from 'umi/withRouter'
+import { withRouter } from 'umi'
 
 import PublicLayout from './PublicLayout'
 import PrimaryLayout from './PrimaryLayout'

src/layouts/PrimaryLayout.js

@@ -2,7 +2,7 @@
 /* global document */
 import React, { PureComponent, Fragment } from 'react'
 import PropTypes from 'prop-types'
-import withRouter from 'umi/withRouter'
+import { withRouter } from 'umi'
 import { connect } from 'dva'
 import { MyLayout } from 'components'
 import { BackTop, Layout, Drawer } from 'antd'

src/layouts/index.js

@@ -1,5 +1,5 @@
 import React, { Component } from 'react'
-import withRouter from 'umi/withRouter'
+import { withRouter } from 'umi'
 import { ConfigProvider } from 'antd'
 import { I18nProvider } from '@lingui/react'
 import { langFromPath, defaultLanguage } from 'utils'

src/pages/chart/ECharts/MainPageComponent.js

@@ -1,6 +1,6 @@
 import React from 'react'
 import AdSense from 'react-adsense'
-import { Link } from 'react-router'
+import { Link } from 'umi'
 import DynamicChartComponent from './DynamicChartComponent.js'
 
 const MainPageComponent = () => {

src/pages/index.js

@@ -1,5 +1,5 @@
 import React, { PureComponent } from 'react'
-import Redirect from 'umi/redirect'
+import { Redirect } from 'umi'
 import { withI18n } from '@lingui/react'
 
 @withI18n()

src/pages/user/components/List.js

@@ -3,7 +3,7 @@ import PropTypes from 'prop-types'
 import { Table, Modal, Avatar } from 'antd'
 import { DropOption } from 'components'
 import { Trans, withI18n } from '@lingui/react'
-import Link from 'umi/link'
+import { Link } from 'umi'
 import styles from './List.less'
 
 const { confirm } = Modal

src/utils/index.js

@@ -1,5 +1,5 @@
 import { cloneDeep, isString, flow, curry } from 'lodash'
-import umiRouter from 'umi/router'
+import { history } from 'umi'
 import pathToRegexp from 'path-to-regexp'
 import { i18n } from './config'
 import moment from 'moment'
@@ -140,11 +140,11 @@ const routerAddLangPrefix = params => {
 /**
  * Adjust the router to automatically add the current language prefix before the pathname in push and replace.
  */
-const myRouter = { ...umiRouter }
+const myRouter = { ...history }
 
 myRouter.push = flow(
   routerAddLangPrefix,
-  umiRouter.push
+  history.push
 )
 
 myRouter.replace = flow(
@@ -266,7 +266,7 @@ export function getLocale() {
 export function setLocale(language) {
   if (getLocale() !== language) {
     moment.locale(language === 'zh' ? 'zh-cn' : language)
-    umiRouter.push({
+    history.push({
       pathname: `/${language}${deLangPrefix(window.location.pathname)}`,
       search: window.location.search,
     })