环境： React@16.2.0 + React-Router@3.2.1 + Redux@5.0.7 + webpack@3.5.6
条目文件：index.js
const MOUNT_NODE = document.getElementById('root');
// Line A
const __DEV__ = window.__DEV__;
let render = () => {
const App = require('./components/App').default;
const routes = require('./pages/router').default(store);
ReactDOM.render(
<App store={store} routes={routes} />,
MOUNT_NODE
);
};
// Development Tools
// ------------------------------------
if (__DEV__) {
if (module.hot) {
const renderApp = render;
const renderError = (error) => {
const RedBox = require('redbox-react').default;
ReactDOM.render(<RedBox error={error} />, MOUNT_NODE);
};
render = () => {
try {
renderApp();
} catch (e) {
renderError(e);
}
};
// Setup hot module replacement
module.hot.accept([
'./components/App',
'./pages/router',
], () =>
setImmediate(() => {
ReactDOM.unmountComponentAtNode(MOUNT_NODE);
render();
})
);
module.hot.accept();
}
}
__DEV__在webpack配置文件中定义：
new webpack.DefinePlugin(Object.assign({
__DEV__: project.env === 'development',
}, project.globals))
然后我启动本地开发服务器 .
但是当我更改jsx时，热重载不起作用，并且警告提示：
process-update.js？e13e：95 [HMR]以下模块无法热更新:(需要完全重新加载）这通常是因为已更改的模块（及其父级）不知道如何热重新加载自己 . 有关详细信息，请参阅https://webpack.js.org/concepts/hot-module-replacement/ .
但是当我删除 line A 时，热重载工作正常，警告提示也会消失 .
这就是为什么？谢谢 .
1 回答
它应该是字符串 . 您需要使用
JSON.stringify将Boolean转换为String. 它应该是请检查DefinePlugin