Django Static Webpack Plugin

Transforms links in the generated html-webpack-plugin html output to Django static template tags, ex: 'bundles/js/main.js' ==> {% static 'bundles/js/main.js' %}

This is an extension plugin for the webpack plugin html-webpack-plugin - a plugin that simplifies the creation of HTML files to serve your webpack bundles.

Installation

Install the plugin with npm:

npm install django-static-webpack-plugin --save-dev

Basic Usage

Add the plugin to your webpack config as follows:

const DjangoStaticWebpackPlugin = require('django-static-webpack-plugin')

webpack.config.js:

module.exports = {
  ...
  plugins: [
    new DjangoStaticWebpackPlugin({
      bundlePath: 'my/bundle/path'
    })
  ]
}

Note: this plugin should be added after HtmlWebpackPlugin.

vue.config.js:

module.exports = {
  ...
  configureWebpack: {
    plugins: [
      new DjangoStaticWebpackPlugin({
        bundlePath: 'my/bundle/path'
      })
    ]
  }
}

Options

The plugin the following options:

bundlePath

The relative path of the webpack generated bundle to django static directory.

If django static files are in /www/my_django/my_django/static/ and the webpack generated bundle is in /www/my_django/my_django/static/bundles/webpack/ then the argument would be: bundles/webpack

the transformed links would be similar to: {% static 'bundles/webpack/js/main_page.1a8660b3.js' %}

excludeFilenames

An array of HtmlWebpackPlugin output filenames to be excluded from processing by this plugin, ex: ['index.html']