Reputation: 100381
I'm using webpack with two entry points:
entry: {
js: './assets/index.js',
css: './assets/sass/all.scss'
},
I want to configure it so when I change a js
or scss
file it automatically run webpack again.
I tried to use webpack-dev-server
with the command:
webpack-dev-server --hot
It looks like it is building again, it outputs the message
webpack: bundle is now VALID.
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:
output: {
path: path.join(__dirname, '/public'),
filename: 'bundle.js'
},
Upvotes: 37
Views: 56106
Reputation: 21
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 through the Express instance it uses to serve the files.
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.
The proper way to handle it is to update your webpack.config.js with a publicPath property:
output: {
path: path.join(__dirname, '/public'),
filename: 'bundle.js',
publicPath: "/public/"
}
In this case the script tag should refer to src="public/bundle.js".
Upvotes: 2
Reputation: 1674
webpack
normally 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_watches
according to the documentation: 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
Upvotes: 1
Reputation: 1698
If you want webpack to watch for changes simply use the watch
flag:
webpack --watch
With this option webpack will watch for changes and re-compile.
Upvotes: 80