Webpack hot module reloading for Fastify
Switch branches/tags
Clone or download
Latest commit 875f222 Nov 1, 2018
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
example Removed ip binding from example/server Sep 15, 2018
test Add option to disable hot middleware Oct 12, 2018
.gitignore Initial commit Sep 8, 2018
.travis.yml Adds node 11 to travis matrix Nov 1, 2018
LICENSE Initial commit Sep 8, 2018
README.md Add option to disable hot middleware Oct 12, 2018
package.json Bumps to v0.4.0 Nov 1, 2018
plugin.js Add option to disable hot middleware Oct 12, 2018

README.md

fastify-webpack-hmr

js-standard-style Build Status Greenkeeper badge Known Vulnerabilities Coverage Status npm npm

Inspired by koa-webpack plugin.
Under the hood it sets up webpack-dev-middleware and webpack-hot-middleware.

Install

$ npm i --save-dev fastify-webpack-hmr

Usage

For a more detailed exampe please check out the example directory.
The plugin accepts a configuration object, with a following properties:

compiler

{object} optional

If you pass a custom webpack compiler instance to the plugin, it will pass that to the middlewares.
Note: if you pass a compiler option the plugin omits the config option.

const fastify = require('fastify')()
const HMR = require('fastify-webpack-hmr')
const webpack = require('webpack')
const webpackConfig = require('path/to/your/webpack/config')

const compiler = webpack(webpackConfig)

fastify.register(HMR, { compiler })

fastify.listen(3000)

config

{string|object} optional

If you pass this option instead of a compiler, the plugin tries to set up the webpack compiler and will pass that compiler instance to the middlewares. For the detailed configuration options please check the webpack documentation.

If config is a string it has to be a path to a valid webpack configuration file.

const fastify = require('fastify')()
const HMR = require('fastify-webpack-hmr')
const { join } = require('path')

const config = join(__dirname, 'path.to.your.webpack.config')

fastify.register(HMR, { config })

fastify.listen(3000)

Or you can directly pass a valid webpack configuration object.

const fastify = require('fastify')()
const HMR = require('fastify-webpack-hmr')
const { join } = require('path')
const hotConf = 'webpack-hot-middleware/client?path=/__webpack_hmr'

const config = {
  mode: 'development', // Prevents webpack warning
  // Add the webpack-hot-middleware to the entry point array.
  entry: [join(__dirname, 'path.to.your.client.file'), hotConf],
  output: {
    publicPath: '/assets',
    filename: 'main.js'
  }
}

fastify.register(HMR, { config })

fastify.listen(3000)

webpackDev

{object} optional

Additional configuration options which will be passed to webpack-dev-middleware.

webpackHot

{boolean|object} optional

You can disable webpack-hot-middleware if you set this option false. If it is an object it will be passed to webpack-hot-middleware.

Multi compiler mode

In multi compiler mode you must pass the webpackDev.publicPath option to the plugin.

Tip: Don't forget to set name parameter when you register webpack-hot-middleware in entry array. It makes sure that bundles don't process each other's updates.

const fastify = require('fastify')()
const HMR = require('fastify-webpack-hmr')
const { join } = require('path')
const hotConf = 'webpack-hot-middleware/client?path=/__webpack_hmr'

const config = [
  {
    name: 'mobile',
    mode: 'development',
    entry: [
      join(__dirname, 'example', 'mobile.js'),
      `${hotConf}&name=mobile`
    ],
    stats: false,
    output: { filename: 'mobile.js', publicPath: '/assets' }
  },
  {
    name: 'desktop',
    mode: 'development',
    entry: [
      join(__dirname, 'example', 'desktop.js'),
      `${hotConf}&name=desktop`
    ],
    stats: false,
    output: { filename: 'desktop.js', publicPath: '/assets' }
  }
]

const webpackDev = { publicPath: '/assets' }

fastify.register(HMR, { config, webpackDev })

fastify.listen(3000)

Reference

This plugin decorates the fastify instance with webpack object. The object has the following properties:

License

Licensed under MIT.