laravel-mix: HRM is conflicting with mix.version()
If anyone can help me figure out this, I have to be honest, I usually try to give more details and possible outcome, but I’m not knowledgable in node stuff so… 😕
Anyway. Running npm run dev, npm run production, npm run watch works without a glitch. But running it for hmr results in this:
ERROR Failed to compile with 1 errors
error in /js/[name].[chunkhash].js
Cannot use [chunkhash] for chunk in '/js/[name].[chunkhash].js' (use [hash] instead)
And this happens after compiling my SASS assets:
[156] (webpack)/hot/emitter.js 77 bytes {0} [built]
[157] ./resources/assets/js/app.js 801 bytes {0} [built]
[158] ./resources/assets/sass/app.scss 41 bytes {0} [built]
[159] ./~/sweetalert2/src/sweetalert2.scss 41 bytes {0} [built]
[160] (webpack)-dev-server/client?http://localhost:8080 4.66 kB {0} [built]
[161] (webpack)/hot/dev-server.js 1.57 kB {0} [built]
[191] ./resources/assets/js/bootstrap.js 1.52 kB {0} [built]
[192] ./resources/assets/js/components.js 1.12 kB {0} [built]
[193] ./resources/assets/js/events/events.js 320 bytes {0} [built]
[197] ./resources/assets/js/vendor.js 156 bytes {0} [built]
[239] ./~/strip-ansi/index.js 161 bytes {0} [built]
[242] ./~/url/url.js 23.3 kB {0} [built]
[267] (webpack)-dev-server/client/socket.js 856 bytes {0} [built]
[269] (webpack)/hot/log-apply-result.js 1.02 kB {0} [built]
[270] multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./resources/assets/js/app.js ./resources/assets/sass/app.scss ./~/sweetalert2/src/sweetalert2.scss 76 bytes {0} [built]
+ 256 hidden modules
ERROR in chunk app [entry]
/js/[name].[chunkhash].js
Cannot use [chunkhash] for chunk in '/js/[name].[chunkhash].js' (use [hash] instead)
Child extract-text-webpack-plugin:
chunk {0} extract-text-webpack-plugin-output-filename 698 kB [entry] [rendered]
[0] ./~/bootstrap-sass/assets/fonts/bootstrap/glyphicons-halflings-regular.eot 92 bytes {0} [built]
[1] ./~/css-loader/lib/css-base.js 1.51 kB {0} [built]
[2] ./~/bootstrap-sass/assets/fonts/bootstrap/glyphicons-halflings-regular.svg 92 bytes {0} [built]
[3] ./~/bootstrap-sass/assets/fonts/bootstrap/glyphicons-halflings-regular.ttf 92 bytes {0} [built]
[4] ./~/bootstrap-sass/assets/fonts/bootstrap/glyphicons-halflings-regular.woff 93 bytes {0} [built]
[5] ./~/bootstrap-sass/assets/fonts/bootstrap/glyphicons-halflings-regular.woff2 94 bytes {0} [built]
[6] ./~/css-loader!./~/postcss-loader!./~/resolve-url-loader!./~/sass-loader?sourceMap!./resources/assets/sass/app.scss 696 kB {0} [built]
Child extract-text-webpack-plugin:
chunk {0} extract-text-webpack-plugin-output-filename 56.8 kB [entry] [rendered]
[0] ./~/css-loader/lib/css-base.js 1.51 kB {0} [built]
[1] ./~/css-loader!./~/postcss-loader!./~/resolve-url-loader!./~/sass-loader?sourceMap!./~/sweetalert2/src/sweetalert2.scss 55.3 kB {0} [built]
About this issue
- Original URL
- State: closed
- Created 7 years ago
- Reactions: 5
- Comments: 16 (1 by maintainers)
same issue, i think the culprit is the
.version()bit, which append the output with.[chunkhash]my workaround:
if(mix.config.inProduction) mix.version();Yeah I’m not sure why this was closed. This should definitely be tackled. While it isn’t a big deal to figure this out for experienced developers, Laravel Mix and Laravel itself is very much targeting beginners.
@vedmant AFAIK the current solution for using HMR during development is, basically, to not include the
mix.version()statement(s) in thewebpack.mix.jsfile (please have a look at the solution provided by @kenvunz).IMHO this issue has not been sufficiently addressed since it still causes a lot of confusion. @JeffreyWay a look into the docs and I couldn’t find a note about HMR conflicting with .version() (here or here or here). Wouldn’t be helpful to add something there?
Careful though, if you did ran a
mixversion()before, themix()method in Laravel will still try to find the manifest, so make sure you do anpm run devso it resets everything to the correct names.