node.js 更改文件后如何重新编译webpack?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/34499390/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to recompile webpack after changing files?
提问by BrunoLM
I'm using webpack with two entry points:
我正在使用带有两个入口点的 webpack:
entry: {
js: './assets/index.js',
css: './assets/sass/all.scss'
},
I want to configure it so when I change a jsor scssfile it automatically run webpack again.
我想配置它,以便当我更改一个js或scss文件时,它会自动再次运行 webpack。
I tried to use webpack-dev-serverwith the command:
我尝试webpack-dev-server与命令一起使用:
webpack-dev-server --hot
It looks like it is building again, it outputs the message
看起来它正在重新构建,它输出消息
webpack: bundle is now VALID.
webpack:包现在有效。
However if I try to refresh the browser I can't see my changes. (Cache disabled on dev tools and Ctrl+F5 pressed). Restarting node also doesn't work, it is as if it had build somewhere else and not on the configured output file:
但是,如果我尝试刷新浏览器,则看不到我的更改。(在开发工具上禁用缓存并按下 Ctrl+F5)。重新启动节点也不起作用,就好像它在其他地方构建而不是在配置的输出文件上:
output: {
path: path.join(__dirname, '/public'),
filename: 'bundle.js'
},
},
回答by Anonymous
If you want webpack to watch for changes simply use the watchflag:
如果您希望 webpack 监视更改,只需使用以下watch标志:
webpack --watch
With this option webpack will watch for changes and re-compile.
使用此选项 webpack 将监视更改并重新编译。
回答by Peter Forgacs
I'm not a webpack expert but what i found is that webpack-dev-server doesn't write to disk. It serves the result from memory trough the Express instance it uses to serve the files.
我不是 webpack 专家,但我发现 webpack-dev-server 不会写入磁盘。它通过用于提供文件的 Express 实例提供内存中的结果。
You can test this by changing the path to localhost:8080/webpack-dev-server/bundle.js in your html file and if you run webpack-dev server the changes should show up.
您可以通过在 html 文件中将路径更改为 localhost:8080/webpack-dev-server/bundle.js 来测试这一点,如果您运行 webpack-dev 服务器,则应该会显示更改。
The proper way to handle it is to update your webpack.config.js with a publicPath property:
处理它的正确方法是使用 publicPath 属性更新您的 webpack.config.js:
output: {
path: path.join(__dirname, '/public'),
filename: 'bundle.js',
publicPath: "/public/"
}
In this case the script tag should refer to src="public/bundle.js".
在这种情况下,脚本标签应该引用 src="public/bundle.js"。
回答by Jeff Pal
webpacknormally rebuild automatically. In my case it was working fine but suddenly it stopped and the solution was to increase the value into file /proc/sys/fs/inotify/max_user_watchesaccording to the documentation: https://webpack.js.org/configuration/watch/#not-enough-watchers
webpack通常自动重建。在我的情况下,它工作正常,但突然停止,解决方案是/proc/sys/fs/inotify/max_user_watches根据文档将值增加到文件中:https: //webpack.js.org/configuration/watch/#not-enough-watchers
run the following command:
运行以下命令:
echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p

