ajmajmajma ajmajmajma - 1 year ago 145
Javascript Question

Webpack, new chunk is loading in with wrong path

I am trying to chunk my app - attempting to follow webpacks guide on how-to (https://webpack.github.io/docs/code-splitting.html). So I have a seperate chunk set up for my app, I can see that webpack is generating

in my build folder, however it is pasting it onto my
with an incorrect path, and in my console I see the fetch error for the

So my webpack config looks like so (im just using the webpack:dev for now):

return {
dev: {
entry: {
index: './client/app.jsx'
output: {
path: path.join(__dirname, '..', '..', 'dist', 'client'),
publicPath: "/dist/client/",
filename: 'bundle.js'
module: {
loaders: [{
test: /\.jsx?$/,
exclude: /node_modules/,
loader: 'babel-loader',
query: {
presets: ['es2015']
}, {
test: /\.json$/,
loader: 'json-loader'
resolve: {
extensions: ['', '.js', '.jsx']
resolveLoader: {
fallback: [path.join(__dirname, 'node_modules')]
plugins: [
new webpack.DefinePlugin({
"process.env": {
"NODE_ENV": JSON.stringify("dev")

and in my index.html I manually add
<script src="bundle.js"></script>
and that has been working great. It looks like when this builds now, webpack is applying its own script tag on my index like so

<script type="text/javascript" charset="utf-8" async="" src="/dist/client/1.bundle.js"></script>

However this path is incorrect, it should just be
. I have tried tweaking the path and publicPath but nothing seems to work. Is there a way to have webpack add the correct path? Thanks!

Answer Source

You should change publicPath for this snippet:

publicPath: "/"

It will always serve your chunks from root path.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download