question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Chunk loading broken due to wrong publicPath

See original GitHub issue
  • Laravel Mix Version: 0.12.1
  • Node Version 8.0.0
  • NPM Version 5.0.x
  • OS: Mac OSX 10.9.6 / Ubuntu 16.04.1

Description:

In https://github.com/JeffreyWay/laravel-mix/pull/209 the webpack public path got changed from ‘./’ to just an empty string. As I just recently started to use chunk splitting, i never noticed this before until I wanted to update the main server today as I am using HMR on my local machine.

The issue seems to be that I’m either neither able to set the public path directly, nor the global.entry.base.

The fix is to just set the publicPath ‘/’ as default again (https://github.com/JeffreyWay/laravel-mix/blob/v0.12.1/src/Mix.js#L69):

publicPath: options.hmr ? (http + '://localhost:8080/') : '/'

The URLs requested in the browser look like the following:

  • Before: my-site.com/som/sub/js/6.(hash).js
  • After: my-site.com/js/6.(hash).js

~I’m not sure if versioning the files has to do anything with this.~ Edit: It doesn’t.

Steps To Reproduce:

  1. Regular laravel installation.
  2. Trigger the chunk-loading, e.g. Vue.component('test', r => require(['./test.vue'], r))
  3. Build using npm run dev or npm run production
  4. Go to a different route than home and see the error in the browser

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Reactions:5
  • Comments:10 (1 by maintainers)

github_iconTop GitHub Comments

9reactions
spacemuddcommented, Nov 7, 2017

I opted to use mix.webpackConfig() in webpack.mix.js instead of editing it directly. Works okay for me.

mix.webpackConfig({
    output: {
	       publicPath: '/',
	       chunkFilename: 'public/js/[name].[chunkhash].js'
	}
});
2reactions
ThaDaVoscommented, Oct 15, 2021

Maybe stupid for commenting on an old issue… but IT SEEMS TO BE BROKEN AGAIN IN LARAVEL MIX 6… so… my next point on the agenda? REMOVE Laravel Mix… I am done with it…

Read more comments on GitHub >

github_iconTop Results From Across the Web

Chunk loading broken due to wrong publicPath #863 - GitHub
In #209 the webpack public path got changed from './' to just an empty string. As I just recently started to use chunk...
Read more >
Webpack Code Splitting 'Loading chunk failed' error wrong file ...
Just update output.publicPath to point where you want it to be => /dist/ . Share.
Read more >
How to Solve the Chunk Load Error in JavaScript - Rollbar
Whenever there's an error observed in dynamically fetching helper JavaScript files known as Chunks, a ChunkLoad Error is thrown.
Read more >
SplitChunksPlugin - webpack
Webpack will automatically split chunks based on these conditions: New chunk can be shared OR modules are from the node_modules folder; New chunk...
Read more >
Webpack (v4) Code Splitting using SplitChunksPlugin - Medium
A chunk is code which will break apart from main bundle that is main.js and form ... Sync chunks are loaded synchronously with...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found