I have been migrating a project from Webpack 4 up to 5 and have hit a snag. The --watch
option is no longer working with my configuration, and I've tried everything I can find.
const webpack = require('webpack');
const path = require('path');
const PATHS = {
build: path.join(__dirname, "dist")
}
const baseConfig = {
entry: {
main: './js/router.js',
},
output: {
path: PATHS.build,
filename: `[name].[chunkhash].js`,
chunkFilename:`[name].[chunkhash].js`,
publicPath: '/dist'
}
//loaders and stuff
}
module.exports = baseConfig;
webpack --watch --progress --mode development
This is what the config can be boiled down to cause the issue. Webpack builds initially fine and I can view the page locally.
But any further changes to the entry point or any modules it imports does not recompile. The progress option I added to the start command has no effect.
I suspect the issue lies with WSL. When I upgraded to webpack 5, I encountered this issue
For some reason webpack 5 tries to scan system files if it is located in /mnt/c
and gets locking errors. I ended up settling on this answer and moving where my project was located from /mnt/c/dev
to /usr/local/dev
. This solved the locking issue, and here I am now.
I have also tried adding to my webpack config:
watchOptions: {
poll: true
}
and also tried playing around with different polling times. Nothing gave me different results.