hbll-dev-server

Helper function to integrate Django and BrowserSync with webpack-dev-server.

Requirements

• node.js v8.9+
• webpack v4.0+
• webpack-dev-server v3.0+

Installation

$ npm install --save-dev @byuhbll/hbll-dev-server

Usage

// webpack.config.js

const hbllDevServer = require('@byuhbll/hbll-dev-server');

module.exports = {
    ...
    devServer: hbllDevServer({
        port: 8000,
        // optionally run and proxy Django dev server
        django: {
            host: '127.0.0.1',
            port: 8001,
            settings: 'config/settings/dev.py',
            restartPatterns: ['./**/*.py', './config.yml', '!node_modules'],
            useRunserverPlus: true,
        },
        // see BrowserSync docs for valid BrowserSync config options:
        // https://www.browsersync.io/docs/options
        browsersync: {
            files: [
                './core/static/css/**/*.css',
                './core/static/img/**/*',
                './core/templates/**/*.html',
            ],
        },
        // hbllDevServer also takes devServer config options and forwards them.
        // See the webpack-dev-server docs for valid config options:
        // https://webpack.js.org/configuration/dev-server/
        stats: { timings: true, chunks: false, modules: false },
    }),
};

The django and browsersync options are not required, and if left out, will not be integrated into the devServer config. All django and browsersync settings are optional as well, providing sane defaults.

Once you've configured your dev server, start it up:

$ webpack-dev-server --mode development --hot