webpack-dev-server: Cannot use [chunkhash] when I run: webpack-dev-server --hot
I’m getting the following error when I run webpack-dev-server --hot
.
ERROR in chunk vendor [entry]
[name].[chunkhash].js
Cannot use [chunkhash] for chunk in '[name].[chunkhash].js' (use [hash] instead)
I do not get this error if I run webpack-dev-server
without the --hot
flag, or if I just run webpack
to build the files.
This is my config file:
var baseConfig = {
resolve: {
root: [__dirname],
},
entry: {
app: [
'showroom/app.js',
'showroom/index.html',
],
vendor: [
'react',
'react-dom',
'babel-polyfill',
],
},
output: {
filename: '[name].[chunkhash].js',
chunkFilename: '[name].[chunkhash].js',
path: 'dist',
},
module: {
loaders: [
{
test: /\.jsx?$/,
exclude: /(node_modules|dist)/,
loader: 'babel-loader',
query: {
plugins: ['transform-runtime'],
presets: ['es2015', 'react'],
}
},
{
test: /\.html$/,
loader: 'file?name=[name].[ext]',
},
{
test: /\.less$/,
loader: 'style!css!less'
},
],
},
plugins: [
// Without these 2 plugins the vendor hash changes every time the app
// changes, even though there are no changes to the vendor.
// https://github.com/webpack/webpack/issues/1315
new WebpackMd5Hash(),
new webpack.NamedModulesPlugin(),
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
filename: '[name].[chunkhash].js',
minChunks: Infinity,
}),
new HtmlWebpackPlugin({
template: 'showroom/index.html',
filename: 'index.html',
minify: {
removeComments: true,
collapseWhitespace: true,
},
}),
]
};
Is this expected behaviour, or a bug?
- webpack: 1.12.11
- webpack-dev-server: 1.14.1
If it’s not expected behaviour, I’d be happy to strip down this config file and create a minimal github repo that reproduces this bug.
Also - I wasn’t sure whether to report this in webpack-dev-server or in webpack.
Thanks!
About this issue
- Original URL
- State: closed
- Created 8 years ago
- Reactions: 22
- Comments: 15 (3 by maintainers)
Commits related to this issue
- 解决 #https://github.com/webpack/webpack-dev-server/issues/377 问题 — committed to xiaoyann/webpack-best-practice by xiaoyann 8 years ago
- chore: move the hash part in filename to query parameters (dev mode) Development builts with HMR enabled have a bunch of problems with hashes in filenames (e.g., https://github.com/webpack/webpack-de... — committed to vuejs/vue-cli by sodatea 6 years ago
- fix: revert file name hashing in dev mode closes #2492 The change was intended to mitigate the problem that Safari keeps caching dev bundles. But it caused several unintended bugs: 1. [Hashes in fi... — committed to vuejs/vue-cli by sodatea 6 years ago
- fix: revert file name hashing in dev mode closes #2492 The change was intended to mitigate the problem that Safari keeps caching dev bundles. But it caused several unintended bugs: 1. [Hashes in fi... — committed to vuejs/vue-cli by sodatea 6 years ago
- build(deps-dev): bump @vue/cli-plugin-babel from 3.0.1 to 3.0.3 (#159) Bumps [@vue/cli-plugin-babel](https://github.com/vuejs/vue-cli) from 3.0.1 to 3.0.3. <details> <summary>Changelog</summary> ... — committed to u3u/prettier-chrome by dependabot[bot] 6 years ago
- build(deps-dev): bump @vue/cli-plugin-eslint from 3.0.1 to 3.0.3 (#158) Bumps [@vue/cli-plugin-eslint](https://github.com/vuejs/vue-cli) from 3.0.1 to 3.0.3. <details> <summary>Changelog</summary> ... — committed to u3u/prettier-chrome by dependabot[bot] 6 years ago
- fix(@angular-devkit/build-angular): disable output hashing when running dev-server Using output hashing with the dev-server can cause memory leaks because the dev server does not know when to clean u... — committed to angular/angular-cli by alan-agius4 4 years ago
- fix(@angular-devkit/build-angular): disable output hashing when running dev-server Using output hashing with the dev-server can cause memory leaks because the dev server does not know when to clean u... — committed to angular/angular-cli by alan-agius4 4 years ago
- chore: move the hash part in filename to query parameters (dev mode) Development builts with HMR enabled have a bunch of problems with hashes in filenames (e.g., https://github.com/webpack/webpack-de... — committed to ZanderOlidan/vue-cli-service-chalkfix by sodatea 6 years ago
- fix: revert file name hashing in dev mode closes #2492 The change was intended to mitigate the problem that Safari keeps caching dev bundles. But it caused several unintended bugs: 1. [Hashes in fi... — committed to ZanderOlidan/vue-cli-service-chalkfix by sodatea 6 years ago
- chore: move the hash part in filename to query parameters (dev mode) Development builts with HMR enabled have a bunch of problems with hashes in filenames (e.g., https://github.com/webpack/webpack-de... — committed to ZanderOlidan/vue-cli-service-chalkfix by sodatea 6 years ago
- fix: revert file name hashing in dev mode closes #2492 The change was intended to mitigate the problem that Safari keeps caching dev bundles. But it caused several unintended bugs: 1. [Hashes in fi... — committed to ZanderOlidan/vue-cli-service-chalkfix by sodatea 6 years ago
Closing this, because you should not use
[chunkhash]
or[hash]
for development. This will cause many other issues, like a memory leak, because the dev server does not know when to clean up the old files.I am working on documenting this, because this has caused many issues.
The issue is closed, but no any solution has been provided. How do you solve the problem? So far I have come up with the following code in my webpack config:
Does any of you know better solution?
Folks, I’m interested about memory leak when hash is used. Memory leak in what? Is there any bug ticket related to the memory leak when hash is used? I’d like to read more about it. Thank you.
I understand this is closed. But I would like to add a scenario that it would have been helpful if we could disable cache for dev server. I am developing a Atalssian plugin, during local/integration test, I expose my local server to the internet with Ngrok (or something similar). If the file is cached, I will not be able to test it.
@SpaceK33z looking at adopting this pattern for our own project but I have a question: if the bundle no longer has a hash in the name, how do we prevent the browser from caching a stale version of the bundle from a previous run?