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）

如何解决你无法改变<router routes =“”>; webpack会被忽略吗？

1 个答案: