Code Splitting

[viperfx]

When bundles get large, which happen fairly easily with the inclusion of React, Redux, Component libraries etc.

The next step to reduce the file size is code splitting based on routes.

Here is an example:

https://reactjs.org/docs/code-splitting.html

Can this be supported by Django Webpack Loader?

[GrimzEcho]

I've been trying this as well. I have a multi-page application written purely in Django and plain JavaScript (with some JQuery). I want to start using React to create some shared components, but I'm struggling with finding a way to have multiple entries that can still share a code base.

I followed the split-chunks method that is detailed at https://webpack.js.org/guides/code-splitting/ but I can't seem to get django-webpack-loader to pick up on the bundles that Webpack produces. The same is true of the Dynamic Imports approach.

Please post a response if you find a solution.

[JulianTenschert]

I don't know if this helps you, but this is how I get django-webpack-loader working with Vue.js (CLI in Multi-Page-Mode). In my Django template I load my app bundle with:

{% render_bundle 'chunk-vendors' 'css' %}
{% render_bundle 'app' 'css' %}

<!-- content/body -->

{% render_bundle 'chunk-vendors' 'js' %}
{% render_bundle 'app' 'js' %}

This is the only way how I was able to use django-webpack-loader in webpack production mode.
I was able to figure it out by looking in webpack-stats.json.

[viperfx]

Julian, that's just code splitting via manual bundles. It's not the same as dynamic splitting based on routes.

…

On Wed, Jul 11, 2018, 17:15 Julian Liederer, ***@***.***> wrote: I don't know if this helps you, but this is how I get django-webpack-loader working with Vue.js (CLI in Multi-Page-Mode). In my Django template I load my app bundle with: {% render_bundle 'chunk-vendors' 'css' %} {% render_bundle 'app' 'css' %} <!-- content/body --> {% render_bundle 'chunk-vendors' 'js' %} {% render_bundle 'app' 'js' %} This is the only way how I was able to use django-webpack-loader in webpack production mode. I was able to figure it out by looking in webpack-stats.json. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#165 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AAUCQS0U7ScWo7us7wmfyPNpJAJS6we-ks5uFiSpgaJpZM4UiZUi> .

[JulianTenschert]

Thanks for clarification! 👍

[armaanahluwalia]

+1 to this issue. We're using this in our Django pipeline but are unable to code split properly due to the limitations of this plugin. I haven't yet found an appropriate solution but will post here incase I do.

[tgdn]

Any updates on this?

[superandrew]

+1

[SalTor]

+1