jiangxy/react-antd-admin

热重载在某些情况下会有问题

ywzhaiqi opened this issue · 4 comments

热重载失效会有2种情况:

情况一

直接修改示例 test.dataSchema.js 后,无法载入内容,一直在 loading,控制台无错误。
2017-06-17_104217

情况二

<Route path="users" tableName="users" getComponent={DBTableContainer} />

修改 schema 后,无法载入内容,控制台错误是

getRouteParams.js:14 Uncaught TypeError: Cannot read property 'path' of undefined
at getRouteParams

临时解决方法

在每次修改后手动刷新页面。

尝试解决

查看了 react-hot-loade 文档,好像说 router v3 异步route 支持不全,不知道是不是这个原因。

React Router v3 is not fully supported (e.g. async routes). If you want to get most of React Hot Loader, consider switching to React Router v4. If you want to understand the reasoning, it's good to start in React Router v4 FAQ

react-router 这个错误,临时解决方法:修改文件 react-router\lib\getRouteParams.js 加入

  if (!route) {
      location.reload()
      return;
  }

这样修改后会自动刷新整个页面。

我用的这个react-hot-loader版本比较老,是有些问题的,有些时候不会生效。。。
原作者好像也在开发新版本了,可以升级下版本试试,我上次看好像还没有发布

经过一段时间观察,好像不是 react-hot-loader 问题,猜测是由于缓存了造成热重载失效。

今天尝试改了下,在 create-react-app 的基础上,添加了 react-hot-loader,解决了碰到的一些问题:

  1. antd 部分组件还不支持 react 16(用回 react 15)
  2. react-hot-loader 不支持 react-router 3 的动态载入。(改为 react-router 4?)
  3. webpack 2+ 不支持 import、module.exports 混用。(改为 export default、require(XXX).default)
  4. antd 版本升级的一些更改