webpack-express-reload

1.0.0 • Public • Published

Webpack Express Reload

Autoreload webpack app running through an express server. Not HMR. Works with webpack-dev-middleware.

Installation

npm install -D webpack-express-reload

Inside your server.js file convert your express server into a server that supports live-reload using SockJS.

const express = require('express');
const path = require('path');
const app = express();
 
const Webpack = require('webpack')
const middleware = require('webpack-dev-middleware');
const webpackConfig = require('./webpack.config');
 
const PORT = process.env.PORT || 3001;
const HOST = process.env.HOST || '0.0.0.0';
 
const compiler = Webpack(webpackConfig);
 
app.use(middleware(compiler));
app.use(express.static(path.resolve(__dirname, 'public')))
 
const server = require('webpack-express-reload')(app, compiler, { path: '/_testapp'});
 
server.listen(PORT, HOST, () => {
  console.log(`Listening on http://${HOST}:${PORT}`);
});

Inside your webpack.config.js add the webpack-express-reload client. Specify the url to connect to the server using ?http://0.0.0.0:3001/_testapp where /_testapp os the path defined in the server config.

const path = require('path');
 
module.exports = {
  entry: [
    path.resolve(__dirname, 'src/index.js'),
    `webpack-express-reload/client?http://0.0.0.0:3001/_testapp`
  ],
  mode: process.env.NODE_ENV || 'development',
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: 'bundle.js',
    publicPath: '/'
  },
}

Package Sidebar

Install

npm i webpack-express-reload

Weekly Downloads

0

Version

1.0.0

License

ISC

Unpacked Size

5.21 kB

Total Files

8

Last publish

Collaborators

  • ajoelp