webpack: webpack-dev-server breaks on changing folder structure or renaming files and requires restart
Do you want to request a feature or report a bug? In my opinion this is a bug because it was working in older versions of webpack.
What is the current behavior? When I rename some file or change folder structure the webpack starts showing “…Module build failed: Error: ENOENT: no such file or directory,…”, and it doesn’t recover from that, so I have to restart webpack dev server in order to have the hot reloading working again. The documentation suggests explicitly setting watchOptions but didn’t work. Is there some cache invalidation that I have to configure or…? If the current behavior is a bug, please provide the steps to reproduce. Described above and my webpack dev configuration is:
const path = require('path');
const webpack = require('webpack');
const config = require('../config');
module.exports = {
entry: [
'react-hot-loader/patch',
'webpack-dev-server/client?http://localhost:9001',
'webpack/hot/only-dev-server',
path.join(config.projectPath, 'src', 'reactApp'),
],
output: {
path: path.join(config.projectPath, 'assets'),
filename: 'bundle.js',
publicPath: 'http://localhost:9001/',
},
devtool: 'cheap-module-eval-source-map',
plugins: [
new webpack.HotModuleReplacementPlugin(),
new webpack.NamedModulesPlugin(),
new webpack.DefinePlugin({
__DEV__: true,
'process.env.NODE_ENV': JSON.stringify('development'),
}),
new webpack.ProvidePlugin({ Promise: 'bluebird' }),
],
resolve: {
extensions: ['.js', '.jsx'],
},
module: {
noParse: /node_modules\/aws-sdk\/dist\/aws-sdk/,
rules: [...],
},
};
And my server.js file:
const devServer = new WebpackDevServer(webpack(webpackConfig), {
hot: true,
watchOptions: { poll: true },
host: 'localhost',
port: 9001,
publicPath: 'http://localhost:9001/',
compress: true,
noInfo: true,
stats: { colors: true, errorDetails: true },
headers: { 'Access-Control-Allow-Origin': '*' },
historyApiFallback: true,
});
devServer.listen(9001);
What is the expected behavior? Like in older versions of webpack, the dev-server should not crash, but pick up the new folder structure. If this is a feature request, what is motivation or use case for changing the behavior? having to manually restart dev server on any file structure change and wait for it to build a bundle is not useful at all. Please mention other relevant information such as the browser version, Node.js version, webpack version and Operating System. I’m using webpack 3.3.0 and webpack-dev-server 2.6.1, latest Chrome browser and Ubuntu 14.04.
About this issue
- Original URL
- State: closed
- Created 7 years ago
- Reactions: 24
- Comments: 20 (8 by maintainers)
This will be fixed in webpack 5
It really would be nice if it was possible to restart the build from scratch without exiting the watcher (think Ctrl-F5 for the watcher). Bonus points if it can re-parse the config it was started with as well. 🥇
@evilebottnawi for me the easiest way to reproduce was trying to change file extension, so another loader will be applied, but cache will not be invalidated for the previous loader. Repo with repro is here https://github.com/Den-dp/webpack-issue-5523-repro and steps are in README too.
@Den-dp thanks
The resolvers cache is a bit unsafe to modifications of already successfully resolved modules. You could disable it with
resolve.unsafeCache: false
but that would make it slow. You probably have to live with it.