webpack-hot-server

0.6.1 • Public • Published

webpack-hot-server

A short-hand to establish a web server for hot reloading.

Install

$ npm install --save-dev webpack-hot-middleware webpack-hot-server

Usage

First, setup webpack-hot-middleware in your webpack config, i.e. add to entry, push the plugin.

devServer.js

You are recommended to use html-webpack-plugin to generate custom HTML output, or this module will use default index.html.

const webpack = require('wenpack')
const webpackHotServer = require('webpack-hot-server')
const webpackConfig = require('./webpack.config')
 
const app = webpackHotServer({
  webpack,
  config: webpackConfig,
  hot: true, // use HMR
  customIndex: true // set when your are using `html-webpack-plugin`,
  // customIndex: '/directory/to/index.html',
  // filename: 'awkward.html',
  wrap(app) {
    app.use() // ... apply your logic or middleware
  },
  compiler: {} // webpack-dev-middleware compiler options
})
 
app.listen(port, () => {
    console.log(`Webpack Hot Server is running at http://lcoalhost:${port}`)
})

Using with React

To enable hot reloading for React components, install babel-preset-react-hmre and put the following code in your .babelrc file:

{
    "env": {
        "development": {
         "presets": ["react-hmre"]
        }
    }
}

Then run NODE_ENV=development node devServer.js

Using with Vue

It has seamless integration with vue-loader, no additional setup if you use that.

License

MIT © EGOIST

Versions

Current Tags

VersionDownloads (Last 7 Days)Tag
0.6.19latest

Version History

VersionDownloads (Last 7 Days)Published
0.6.19
0.6.01
0.5.11
0.5.01
0.4.31
0.4.21
0.4.11
0.4.01
0.3.61
0.3.51
0.3.41
0.3.31
0.3.21
0.3.11
0.3.01
0.2.20
0.2.10
0.2.00
0.1.20
0.1.10
0.1.00
0.0.10

Package Sidebar

Install

npm i webpack-hot-server

Weekly Downloads

23

Version

0.6.1

License

MIT

Last publish

Collaborators

  • kchan
  • rem