reactjs - 无法更改 如何解决； webpack 会忽略它吗？

Question

我正在尝试为react/webpack/gulp实现HMR，这是我的组件:

import React from 'react';

class main extends React.Component {

    constructor(props) {
        super(props);

    }
    render() {

        return (
            <div>Hi this is fdsfdsfs</div>
        );
    }
}

export default main;

这是我的index.js:

import React from 'react';
import ReactDOM from 'react-dom';
import App from './main';


ReactDOM.render(
    <main/>
 ,
  document.getElementById('root')
);

当我更改文件时，我得到:

 client:37 [WDS] App updated. Recompiling...
only-dev-server.js:69 [HMR] Checking for updates on the server...
client:37 [WDS] App hot update...
browser.js:49 Warning: [react-router] You cannot change <Router routes>; it will 
log-apply-result.js:20 [HMR] Updated modules:
log-apply-result.js:22 [HMR]  - 320
log-apply-result.js:22 [HMR]  - 273
log-apply-result.js:22 [HMR]  - 77
only-dev-server.js:55 [HMR] App is up to date.

问题是如何解决:

 you cannot change <Router routes>; it will be ignored with webpack

另请参阅here

Answer 1

此问题是由 react-router v2 和 v3 引起的。

您使用的样板依赖于 react-router，并在 src/routes.js 中使用它。

使用此版本的 react-router 解决这个问题实际上并不简单(请参见此处:https://github.com/ReactTraining/react-router/issues/2982 或此处:https://github.com/gaearon/react-hot-loader/issues/68)

您还可以实现处于预发布状态的 react-router v4 ( https://github.com/ReactTraining/react-router/tree/v4 )