diff --git a/.umirc.js b/.umirc.js
index e8b9c89..25c97ae 100644
--- a/.umirc.js
+++ b/.umirc.js
@@ -1,6 +1,5 @@
// 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')
@@ -14,32 +13,8 @@ export default {
dva: { immer: true },
antd: {},
dynamicImport: {
- // loading: 'components/Loader/Loader'
+ 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
-
- // return routes
- // },
- // },
// not support in umi@3
// pwa: {
// manifestOptions: {
@@ -67,6 +42,7 @@ export default {
themes: resolve(__dirname, './src/themes'),
utils: resolve(__dirname, './src/utils'),
},
+ extraBabelPresets: ['@lingui/babel-preset-react'],
extraBabelPlugins: [
[
'import',
diff --git a/config/theme.config.js b/config/theme.config.js
deleted file mode 100644
index 6a454e5..0000000
--- a/config/theme.config.js
+++ /dev/null
@@ -1,8 +0,0 @@
-const fs = require('fs')
-const path = require('path')
-const lessToJs = require('less-vars-to-js')
-
-module.exports = () => {
- const themePath = path.join(__dirname, '../src/themes/default.less')
- return lessToJs(fs.readFileSync(themePath, 'utf8'))
-}
diff --git a/docs/faq.md b/docs/faq.md
index be1c24e..2c6409d 100644
--- a/docs/faq.md
+++ b/docs/faq.md
@@ -5,5 +5,5 @@ Most asked
## create new page
1. just copy a page in /src/pages (route here auto generated by [umi](https://umijs.org/guide/router.html#basic-routing))
- 2. modify namespace/pathMatchRegexp in model.js
+ 2. modify namespace/pathToRegexp in model.js
3. modify mock route.js to add a route
\ No newline at end of file
diff --git a/docs/zh-cn/faq.md b/docs/zh-cn/faq.md
index 4402e46..bf5f1bd 100644
--- a/docs/zh-cn/faq.md
+++ b/docs/zh-cn/faq.md
@@ -3,5 +3,5 @@
## 新建页面
1. 直接从/src/pages复制一个page (会自动创建路由[umi](https://umijs.org/zh/guide/router.html#%E7%BA%A6%E5%AE%9A%E5%BC%8F%E8%B7%AF%E7%94%B1))
- 2. 修改 namespace/pathMatchRegexp 在 model.js
+ 2. 修改 namespace/pathToRegexp 在 model.js
3. 修改 mock中route.js增加一条route
\ No newline at end of file
diff --git a/docs/zh-cn/i18n.md b/docs/zh-cn/i18n.md
index 1eb7c3d..33244d6 100644
--- a/docs/zh-cn/i18n.md
+++ b/docs/zh-cn/i18n.md
@@ -12,7 +12,7 @@
npm run add-locale ja
```
-2. 提取代码中需要翻译的字段，即 `message`、`` i18n.t`message `` 中 `message` 字段，运行下面命令后 `src/locales/ja/messages.json` 将会出现提取后的字段配置。
+2. 提取代码中需要翻译的字段，即 `message`、`` intl.formatMessage({ id: 'message `` 中 `message` 字段，运行下面命令后 `src/locales/ja/messages.json' }) 将会出现提取后的字段配置。
```bash
npm run extract
diff --git a/mock/user.js b/mock/user.js
index a229311..4ffd4d3 100644
--- a/mock/user.js
+++ b/mock/user.js
@@ -1,4 +1,5 @@
-import { Mock, Constant, qs, randomAvatar } from './_utils'
+import { Mock, Constant, randomAvatar } from './_utils'
+import qs from 'qs'
const { ApiPrefix } = Constant
diff --git a/package.json b/package.json
index 4718acf..6e00baf 100644
--- a/package.json
+++ b/package.json
@@ -6,6 +6,7 @@
"dependencies": {
"@ant-design/compatible": "^1.0.0",
"@ant-design/icons": "^4.0.0",
+ "@lingui/react": "^2.8.0",
"ant-design-pro": "^2.3.0",
"antd": "^4.0.0",
"axios": "^0.19.0",
@@ -38,6 +39,9 @@
"store": "^2.0.0"
},
"devDependencies": {
+ "@lingui/babel-preset-react": "^2.8.2",
+ "@lingui/cli": "^2.8.2",
+ "@lingui/loader": "^2.8.2",
"@umijs/preset-react": "^1.4.0",
"babel-eslint": "^10.0.1",
"babel-plugin-dev-expression": "^0.2.1",
diff --git a/src/components/Layout/Bread.js b/src/components/Layout/Bread.js
index cb55076..473a7a6 100644
--- a/src/components/Layout/Bread.js
+++ b/src/components/Layout/Bread.js
@@ -3,7 +3,8 @@ import PropTypes from 'prop-types'
import { Breadcrumb } from 'antd'
import { Link, withRouter } from 'umi'
import { Icon as LegacyIcon } from '@ant-design/compatible'
-import { pathMatchRegexp, queryAncestors, addLangPrefix } from 'utils'
+const { pathToRegexp } = require("path-to-regexp")
+import { queryAncestors } from 'utils'
import styles from './Bread.less'
@withRouter
@@ -23,7 +24,7 @@ class Bread extends PureComponent {
item && (
{paths.length - 1 !== key ? (
- {content}
+ {content}
) : (
content
)}
@@ -37,7 +38,7 @@ class Bread extends PureComponent {
// Find a route that matches the pathname.
const currentRoute = routeList.find(
- _ => _.route && pathMatchRegexp(_.route, location.pathname)
+ _ => _.route && pathToRegexp(_.route, location.pathname)
)
// Find the breadcrumb navigation of the current route match and all its ancestors.
diff --git a/src/components/Layout/Menu.js b/src/components/Layout/Menu.js
index b67f13e..04d7ebb 100644
--- a/src/components/Layout/Menu.js
+++ b/src/components/Layout/Menu.js
@@ -3,11 +3,10 @@ import PropTypes from 'prop-types'
import { Icon as LegacyIcon } from '@ant-design/compatible'
import { Menu } from 'antd'
import { NavLink, withRouter } from 'umi'
+const { pathToRegexp } = require("path-to-regexp")
import {
arrayToTree,
queryAncestors,
- pathMatchRegexp,
- addLangPrefix,
} from 'utils'
import store from 'store'
@@ -57,7 +56,7 @@ class SiderMenu extends PureComponent {
}
return (
-
+
{item.icon && }
{item.name}
@@ -81,7 +80,7 @@ class SiderMenu extends PureComponent {
// Find a menu that matches the pathname.
const currentMenu = menus.find(
- _ => _.route && pathMatchRegexp(_.route, location.pathname)
+ _ => _.route && pathToRegexp(_.route, location.pathname)
)
// Find the key that should be selected according to the current menu.
diff --git a/src/components/Layout/Sider.js b/src/components/Layout/Sider.js
index 214536c..62b4854 100644
--- a/src/components/Layout/Sider.js
+++ b/src/components/Layout/Sider.js
@@ -1,12 +1,14 @@
import React, { PureComponent } from 'react'
import PropTypes from 'prop-types'
import { Switch, Layout } from 'antd'
+import { withI18n, Trans } from '@lingui/react'
import { BulbOutlined } from '@ant-design/icons'
import ScrollBar from '../ScrollBar'
import { config } from 'utils'
import SiderMenu from './Menu'
import styles from './Sider.less'
+@withI18n()
class Sider extends PureComponent {
render() {
const {
diff --git a/src/layouts/PrimaryLayout.js b/src/layouts/PrimaryLayout.js
index 27196e9..be55ecf 100644
--- a/src/layouts/PrimaryLayout.js
+++ b/src/layouts/PrimaryLayout.js
@@ -2,13 +2,14 @@
/* global document */
import React, { PureComponent, Fragment } from 'react'
import PropTypes from 'prop-types'
-import { withRouter } from 'umi'
+import { withRouter, getLocale } from 'umi'
import { connect } from 'dva'
import { MyLayout } from 'components'
import { BackTop, Layout, Drawer } from 'antd'
import { GlobalFooter } from 'ant-design-pro'
import { enquireScreen, unenquireScreen } from 'enquire-js'
-import { config, pathMatchRegexp, langFromPath } from 'utils'
+const { pathToRegexp } = require("path-to-regexp")
+import { config } from 'utils'
import Error from '../pages/404'
import styles from './PrimaryLayout.less'
import store from 'store'
@@ -56,7 +57,7 @@ class PrimaryLayout extends PureComponent {
// Localized route name.
- const lang = langFromPath(location.pathname)
+ const lang = getLocale()
const newRouteList =
lang !== 'en'
? routeList.map(item => {
@@ -70,7 +71,7 @@ class PrimaryLayout extends PureComponent {
// Find a route that matches the pathname.
const currentRoute = newRouteList.find(
- _ => _.route && pathMatchRegexp(_.route, location.pathname)
+ _ => _.route && pathToRegexp(_.route, location.pathname)
)
// Query whether you have permission to enter this page
diff --git a/src/models/app.js b/src/models/app.js
index bfba377..129d3d1 100644
--- a/src/models/app.js
+++ b/src/models/app.js
@@ -1,10 +1,11 @@
/* global window */
-import { router } from 'utils'
+import { history } from 'umi'
import { stringify } from 'qs'
import store from 'store'
+const { pathToRegexp } = require("path-to-regexp")
import { ROLE_TYPE } from 'utils/constant'
-import { queryLayout, pathMatchRegexp } from 'utils'
+import { queryLayout } from 'utils'
import { CANCEL_REQUEST_MESSAGE } from 'utils/constant'
import api from 'api'
import config from 'config'
@@ -12,8 +13,8 @@ import config from 'config'
const { queryRouteList, logoutUser, queryUserInfo } = api
const goDashboard = () => {
- if (pathMatchRegexp(['/', '/login'], window.location.pathname)) {
- router.push({
+ if (pathToRegexp(['/', '/login'], window.location.pathname)) {
+ history.push({
pathname: '/dashboard',
})
}
@@ -112,7 +113,7 @@ export default {
store.set('isInit', true)
goDashboard()
} else if (queryLayout(config.layouts, locationPathname) !== 'public') {
- router.push({
+ history.push({
pathname: '/login',
search: stringify({
from: locationPathname,
diff --git a/src/pages/dashboard/model.js b/src/pages/dashboard/model.js
index 2b1930f..6d0fb07 100644
--- a/src/pages/dashboard/model.js
+++ b/src/pages/dashboard/model.js
@@ -1,7 +1,7 @@
import { parse } from 'qs'
import modelExtend from 'dva-model-extend'
import api from 'api'
-import { pathMatchRegexp } from 'utils'
+const { pathToRegexp } = require("path-to-regexp")
import { model } from 'utils/model'
const { queryDashboard, queryWeather } = api
@@ -35,8 +35,8 @@ export default modelExtend(model, {
setup({ dispatch, history }) {
history.listen(({ pathname }) => {
if (
- pathMatchRegexp('/dashboard', pathname) ||
- pathMatchRegexp('/', pathname)
+ pathToRegexp('/dashboard', pathname) ||
+ pathToRegexp('/', pathname)
) {
dispatch({ type: 'query' })
dispatch({ type: 'queryWeather' })
diff --git a/src/pages/index.js b/src/pages/index.js
index e06ea69..b34ad05 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -1,12 +1,12 @@
import React, { PureComponent } from 'react'
-import { Redirect, useIntl } from 'umi'
+import { Redirect } from 'umi'
+import { withI18n } from '@lingui/react'
+@withI18n()
class Index extends PureComponent {
render() {
- return
+ const { i18n } = this.props
+ return
}
}
diff --git a/src/pages/login/model.js b/src/pages/login/model.js
index e6d8c66..330ead6 100644
--- a/src/pages/login/model.js
+++ b/src/pages/login/model.js
@@ -1,4 +1,5 @@
-import { router, pathMatchRegexp } from 'utils'
+import { history } from 'umi'
+const { pathToRegexp } = require("path-to-regexp")
import api from 'api'
const { loginUser } = api
@@ -15,11 +16,11 @@ export default {
if (data.success) {
const { from } = locationQuery
yield put({ type: 'app/query' })
- if (!pathMatchRegexp('/login', from)) {
- if (['', '/'].includes(from)) router.push('/dashboard')
- else router.push(from)
+ if (!pathToRegexp('/login', from)) {
+ if (['', '/'].includes(from)) history.push('/dashboard')
+ else history.push(from)
} else {
- router.push('/dashboard')
+ history.push('/dashboard')
}
} else {
throw data
diff --git a/src/pages/post/index.js b/src/pages/post/index.js
index 10dfbdb..7d8e2f2 100644
--- a/src/pages/post/index.js
+++ b/src/pages/post/index.js
@@ -2,7 +2,7 @@ import React, { PureComponent } from 'react'
import PropTypes from 'prop-types'
import { connect } from 'dva'
import { Tabs } from 'antd'
-import { router } from 'utils'
+import { history } from 'umi'
import { stringify } from 'qs'
import { Page } from 'components'
import List from './components/List'
@@ -19,7 +19,7 @@ class Post extends PureComponent {
handleTabClick = key => {
const { pathname } = this.props.location
- router.push({
+ history.push({
pathname,
search: stringify({
status: key,
@@ -37,7 +37,7 @@ class Post extends PureComponent {
dataSource: list,
loading: loading.effects['post/query'],
onChange(page) {
- router.push({
+ history.push({
pathname,
search: stringify({
...query,
diff --git a/src/pages/post/model.js b/src/pages/post/model.js
index 73f22e0..dd47deb 100644
--- a/src/pages/post/model.js
+++ b/src/pages/post/model.js
@@ -1,6 +1,6 @@
import modelExtend from 'dva-model-extend'
import api from 'api'
-import { pathMatchRegexp } from 'utils'
+const { pathToRegexp } = require("path-to-regexp")
import { pageModel } from 'utils/model'
const { queryPostList } = api
@@ -11,7 +11,7 @@ export default modelExtend(pageModel, {
subscriptions: {
setup({ dispatch, history }) {
history.listen(location => {
- if (pathMatchRegexp('/post', location.pathname)) {
+ if (pathToRegexp('/post', location.pathname)) {
dispatch({
type: 'query',
payload: {
diff --git a/src/pages/user/[id]/models/detail.js b/src/pages/user/[id]/models/detail.js
index 7bbcfb1..af27380 100644
--- a/src/pages/user/[id]/models/detail.js
+++ b/src/pages/user/[id]/models/detail.js
@@ -1,4 +1,4 @@
-import { pathMatchRegexp } from 'utils'
+const { pathToRegexp } = require("path-to-regexp")
import api from 'api'
const { queryUser } = api
@@ -13,7 +13,7 @@ export default {
subscriptions: {
setup({ dispatch, history }) {
history.listen(({ pathname }) => {
- const match = pathMatchRegexp('/user/:id', pathname)
+ const match = pathToRegexp('/user/:id', pathname)
if (match) {
dispatch({ type: 'query', payload: { id: match[1] } })
}
diff --git a/src/pages/user/index.js b/src/pages/user/index.js
index c0d6a0e..83b5911 100644
--- a/src/pages/user/index.js
+++ b/src/pages/user/index.js
@@ -1,6 +1,6 @@
import React, { PureComponent } from 'react'
import PropTypes from 'prop-types'
-import { router } from 'utils'
+import { history } from 'umi'
import { connect } from 'dva'
import { Row, Col, Button, Popconfirm } from 'antd'
import { Page } from 'components'
@@ -16,7 +16,7 @@ class User extends PureComponent {
const { location } = this.props
const { query, pathname } = location
- router.push({
+ history.push({
pathname,
search: stringify(
{
diff --git a/src/pages/user/model.js b/src/pages/user/model.js
index e598c07..612eaff 100644
--- a/src/pages/user/model.js
+++ b/src/pages/user/model.js
@@ -1,5 +1,5 @@
import modelExtend from 'dva-model-extend'
-import { pathMatchRegexp } from 'utils'
+const { pathToRegexp } = require("path-to-regexp")
import api from 'api'
import { pageModel } from 'utils/model'
@@ -24,7 +24,7 @@ export default modelExtend(pageModel, {
subscriptions: {
setup({ dispatch, history }) {
history.listen(location => {
- if (pathMatchRegexp('/user', location.pathname)) {
+ if (pathToRegexp('/user', location.pathname)) {
const payload = location.query || { page: 1, pageSize: 10 }
dispatch({
type: 'query',
diff --git a/src/utils/index.js b/src/utils/index.js
index c61eea1..7fceadf 100644
--- a/src/utils/index.js
+++ b/src/utils/index.js
@@ -55,16 +55,6 @@ export function arrayToTree(
return result
}
-/**
- * Whether the path matches the regexp if the language prefix is ignored, https://github.com/pillarjs/path-to-regexp.
- * @param {string|regexp|array} regexp Specify a string, array of strings, or a regular expression.
- * @param {string} pathname Specify the pathname to match.
- * @return {array|null} Return the result of the match or null.
- */
-export function pathMatchRegexp(regexp, pathname) {
- return pathToRegexp(regexp).exec(deLangPrefix(pathname))
-}
-
/**
* In an array object, traverse all parent IDs based on the value of an object.
* @param {array} array The Array need to Converted.
@@ -127,7 +117,7 @@ export function queryLayout(layouts, pathname) {
const isMatch = regepx => {
return regepx instanceof RegExp
? regepx.test(pathname)
- : pathMatchRegexp(regepx, pathname)
+ : pathToRegexp(regepx, pathname)
}
for (const item of layouts) {
diff --git a/src/utils/index.test.js b/src/utils/index.test.js
index f18bbe8..2118ee4 100644
--- a/src/utils/index.test.js
+++ b/src/utils/index.test.js
@@ -1,19 +1,18 @@
-import { pathMatchRegexp } from './index'
const { pathToRegexp } = require("path-to-regexp")
-describe('test pathMatchRegexp', () => {
+describe('test pathToRegexp', () => {
it('get right', () => {
- expect(pathMatchRegexp('/user', '/zh/user')).toEqual(
+ expect(pathToRegexp('/user', '/zh/user')).toEqual(
pathToRegexp('/user').exec('/user')
)
- expect(pathMatchRegexp('/user', '/user')).toEqual(
+ expect(pathToRegexp('/user', '/user')).toEqual(
pathToRegexp('/user').exec('/user')
)
- expect(pathMatchRegexp('/user/:id', '/zh/user/1')).toEqual(
+ expect(pathToRegexp('/user/:id', '/zh/user/1')).toEqual(
pathToRegexp('/user/:id').exec('/user/1')
)
- expect(pathMatchRegexp('/user/:id', '/user/1')).toEqual(
+ expect(pathToRegexp('/user/:id', '/user/1')).toEqual(
pathToRegexp('/user/:id').exec('/user/1')
)
})
diff --git a/src/utils/request.js b/src/utils/request.js
index 3c272f4..e3b18a5 100644
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -1,9 +1,8 @@
import axios from 'axios'
import { cloneDeep, isEmpty } from 'lodash'
-const { pathToRegexp } = require("path-to-regexp")
+const { parse, compile } = require("path-to-regexp")
import { message } from 'antd'
import { CANCEL_REQUEST_MESSAGE } from 'utils/constant'
-import qs from 'qs'
const { CancelToken } = axios
window.cancelRequest = new Map()
@@ -20,8 +19,8 @@ export default function request(options) {
url = url.slice(domain.length)
}
- const match = pathToRegexp.parse(url)
- url = pathToRegexp.compile(url)(data)
+ const match = parse(url)
+ url = compile(url)(data)
for (const item of match) {
if (item instanceof Object && item.name in cloneData) {