最近在研究webpack2的配置,发现遇到了很多的问题,而且一绊就是好久。
其实webpack2的配置,官方文档讲的还是很清楚明白的,很多的配置也清晰灵活了好多,应该是自己对webpack还不是太熟悉,一直停留使用封装好的框架上,对内部的一些配置不明就里。这里将自己在配置过程中出现的各种问题记录下,防止踩坑
1. webpack-dev-server不能处理import
其实这个问题真的是困扰了好久,在控制台运行webpack-dev-server --host 0.0.0.0
之后,打包出来的文件,不能处理import 和 export, 控制台也没有报错,后来重新安装了下webpack-dev-server
就好了,扎心~~
2. HMR 无效
控制台报错信息如下
[HMR] Waiting for update signal from WDS...
warning.js:36 Warning: Unknown DOM property for. Did you mean htmlFor?
client:14 [WDS] Hot Module Replacement enabled.
client:18 [WDS] App updated. Recompiling...
client:60 [WDS] App hot update...
dev-server.js:48 [HMR] Checking for updates on the server...
dev-server.js:28 [HMR] Updated modules:
dev-server.js:30 [HMR] - 3
dev-server.js:34 [HMR] App is up to date.
bundle.js:695 Uncaught RangeError: Maximum call stack size exceeded
hotAddUpdateChunk@bundle.js:5
webpackHotUpdateCallback@bundle.js:6
webpackHotUpdateCallback@bundle.js:6
...webpackHotUpdateCallback@bundle.js:6 repeated many more times...
后来查阅发现,是在运行webpack-dev-server
命令的时候,去掉--hot
命令即可
注意,在模块中,还需要如下的代码,才能开启HMR
if (module.hot) module.hot.accept()