GitHunt
VS

vslinko/webpack-amok-dev-server

[TODO] Amok for your webpack

webpack-amok-dev-server

Amok for your webpack.

Pros

  • Amok replacing function definitions instead of webpack modules.
    This means that all references to changed functions in your application
    will use functions with updated definitions just after they're be replaced.
    This is very helpful when you're calibrating your function behaviour.

  • WebpackAmokDevServer stores compiled code in memory just like WebpackDevServer.
    This reduces delay between code change and code replacement.

Cons

  • Amok just replacing your function definitions.
    So if you want to rerender your compoment or whole app
    you should subscribe to patch event and implement that behaviour manually.

  • At current moment WebpackAmokDevServer is slower than WebpackDevServer
    with React Hot Loader on large builds because WebpackAmokDevServer is trying
    to reload whole build.

  • Amok supports only Google Chrome and Chromium.

Usage

// webpack.config.js

module.exports = {
  // Your webpack configuration...

  amokDevServer: {
    // Same as output.path
    // WebpackAmokDevServer uses this configuration to match file path and url.
    cwd: path.join(__dirname, '.app', 'public'),

    // Same as output.publicPath
    // WebpackAmokDevServer uses this configuration to match file path and url.
    publicPath: '/',

    // Same as output.filename
    // WebpackAmokDevServer uses this configuration to match file path and url.
    filename: 'frontend.js',

    // WebpackAmokDevServer could proxy any request that not matched as webpack build
    // to any other external backend.
    proxy: {
      '*': 'http://localhost:3000',
    },
  },
}
// server.js

var webpack = require('webpack')
var WebpackAmokDevServer = require('webpack-amok-dev-server')

var webpackConfig = require('./webpack.config.js')

var server = new WebpackAmokDevServer(
  webpack(webpackConfig),
  webpackConfig.amokWebServer
)

server.listen(8080, '0.0.0.0', function(error) {
  if (error) {
    console.error(error)
  } else {
    console.log('WebpackAmokDevServer started')
  }
})
node server.js # WebpackAmokDevServer will open Google Chrome on http://localhost:8080

Languages

JavaScript100.0%

Contributors

MIT License
Created June 5, 2015
Updated April 7, 2024