我的环境
- 宿主机 Windows 10
- docker 容器 Ubuntu
- webpack
- 数据共享方式: 将宿主机的目录直接映射到容器内
- 工作模式:在容器内启动 webpack 服务监听,在宿主机上编辑文件
遇到的坑...
- 容器内的 webpack 监听不到宿主机对文件的修改,很伤
- 爬坑....
- 找到了这个 docker容器内webpack热更新的问题
- 然后找到了这个Issues 在docker容器内运行webpack-dev-server,源文件的更改不会被webpack接收到
- 还在webpack文档的Watch选项最后看到了这句话
If watching does not work for you, try out this option. Watching does not work with NFS and machines in VirtualBox.
那么,现在大概清晰了。这就是webpack跨文件系统监听上的一个BUG。需要用watch的事件轮询方法去监听文件是否有变化。(⊙o⊙)…,好坑啊。
解决
- 使用dev-server时, 在
webpack.config.js
添加选项官档参考链接
devServer: {
historyApiFallback: true,
noInfo: false,
host: '0.0.0.0',
port: 8080
},
watch: true,
watchOptions: {
ignored: /node_modules/,
aggregateTimeout: 300,
poll: 500
},
- 在
webpack-dev-middleware
的options
中加入watchOptions
选项官档参考链接
var devMiddleware = require('webpack-dev-middleware')(compiler, {
publicPath: webpackConfig.output.publicPath,
quiet: true,
stats: {
colors: true,
chunks: false
},
watchOptions: {
aggregateTimeout: 300,
poll: true
}
})