Webpack loading bundle but not executing code

Viewed 221

I'm using django to load the webpack chunks and I have some entry points. The problems is that I have a vendor chunk that wraps all the node_modules packages and the application works fine in almost all the entry points. But there are a couple of entry points that does not need the vendor chunk to be loaded and if i not add the vendor chunk, the entry point file is loaded in the browser but the code is not executed. If i load the vendor chunk with the entry point, works.

For example i have this entrypoint:

entry: {
  signup: path.join(sourcePath, 'signup/signup.js'),
  ...
}

The content of signup is basically a console.log() and it requires a stylesheet

And the entry point is loaded in the template like this

<head>
  {% render_bundle 'signup' 'css' %}
  {% render_bundle 'signup' 'js' %}

</head>
<body>
....
</body>

Also i'm creating the vendor bundle in webpack config like this:

config.optimization = {
  splitChunks: {
    cacheGroups: {
      commons: {
        test: /[\\/]node_modules[\\/]/,
        name: 'vendor',
        chunks: 'initial',
      }
    }
  }
};

When i load the page in the browser it is not loading the styles and is not executing the console.log inside the entry point chunk, but I can see the signup chunk code

file loaded in browser

Also i've been doing some tests and I have realized that it works fine if I load the chunk vendor in the template as well, like this:

<head>
  {% render_bundle 'signup' 'css' %}
  {% render_bundle 'signup' 'js' %}

  {% render_bundle 'vendor' 'js %}

</head>
<body>
....
</body>

Anyone has any idea of why is happening that? I don't need the vendor bundle in this template but webpack is forcing me to add it

I'm using webpack 5.18.0

Thanks for the help!

0 Answers
Related