为什么在webpack输入文件中使用窗口会影响反应热重加载？
为什么在webpack输入文件中使用窗口会影响反应热重加载？
提问于 2018-03-30 02:46:45
环境：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))然后启动本地dev服务器。
但是，当我更改jsx时，热重加载不起作用，警告提示：
进程-update.js?e13e:95 HMR以下模块无法热更新：(需要完全重新加载)这通常是因为模块已经更改(以及它们的父模块)不知道如何热重新加载自己。有关更多详细信息，请参阅https://webpack.js.org/concepts/hot-module-replacement/。
但是当我删除行A时，热重加载工作正常，警告提示也消失了。
这就是为什么？谢谢。
回答 1
Stack Overflow用户
发布于 2018-03-30 04:10:17
应该是绳子。您需要使用JSON.stringify将Boolean转换为String。它应该是
new webpack.DefinePlugin(Object.assign({
__DEV__: JSON.stringify(project.env === 'development'),
}, project.globals))请检查DefinePlugin
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/49567732
复制相关文章
相似问题
腾讯云开发者
