Home

Awesome

No longer maintained!

Elm Hot Loader Version

Hot code swapping for Elm.

This loader injects HMR support code to the Elm module generated by elm-webpack-loader.

NPM

Change Log

0.5.0

0.4.0

0.3.3

0.3.1

0.3.0

Installation

$ npm install --save elm-webpack-loader elm-hot-loader

Usage

Documentation: Using loaders

In your webpack.config.js file:

With webpack 2+

module.exports = {
  module: {
    rules: [{
      test: /\.elm$/,
      exclude: [/elm-stuff/, /node_modules/],
      use: [
        'elm-hot-loader',
        'elm-webpack-loader',
      ]
    }]
  }
};

With webpack 1

module.exports = {
  module: {
    loaders: [{
      test: /\.elm$/,
      exclude: [/elm-stuff/, /node_modules/],
      loader: 'elm-hot!elm-webpack'
    }]
  }
};

If you don't use elm-webpack-loader to compile Elm, just make sure webpack uses elm-hot to load your compiled js file. Add this to your webpack config file:

With webpack 2+

rules: [
  // ...
  {
      test: /[YOUR_COMPILED_JS_FILE_NAME_HERE]\.js$/,
      loader: 'elm-hot-loader',
  }
  // ...
]

With webpack 1

loaders: [
  // ...
  {
      test: /[YOUR_COMPILED_JS_FILE_NAME_HERE]\.js$/,
      loader: 'elm-hot',
  }
  // ...
]

You should also add the --hot flag when starting webpack.

Dependency

This loader relies on elm-webpack-loader to compile Elm to JS.

Example

You can find an example project at elm-hot-loader-starter.