Search code examples
djangodjango-webpack-loader

Why should we use django-webpack-loader?


I use both webpack and django. Now I move bundled assets to /static/ directory of django each time, so I'd like to make more effective process.
I read some articles and many people recommend to use django-webpack-loader, but I don't fully understand what it does.

I've already read the official documents below.
https://owais.lone.pw/blog/webpack-plus-reactjs-and-django/
https://406.ch/writing/our-approach-to-configuring-django-webpack-and-manifeststaticfilesstorage/

I think it's for collecting bundled assets located outside of django projects, but it seems almost same as creating a symbolic link from django project to dist/ directory in webpack.
Is there any other useful feature in django-webpack-loader?


Solution

  • It's a handy little tool. This gist of webpack loader is create a mechanism to link up to your latest bundle in an automated fashion.

    A "render_bundle" template tag is provided that outputs link to load in either your latest JS or CSS bundle.

    The tag is based from a hash of the bundle code (so this will change if your bundle changes) therefore browsers will always load in the most up-to-date version of your static assets. This cache-busting technique is useful when testing on mobile devices or situations where performing a 'hard' refresh of the page is not straightforward.

    I believe this is achieved by the template tag referring to the output of BundleTracker, which outputs metadata about the status of your webpack bundle in webpack-stats.json.

    https://www.npmjs.com/package/webpack-bundle-tracker