This repository has been archived by the owner. It is now read-only.
Hot Module Replacement for Elm using webpack.
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.

README.md

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

  • Elm 0.18 support

0.4.0

0.3.3

  • Better elm-lang/websocket support (thanks to @rundis)

0.3.1

  • Don't error when there are no ports (thanks to @glenjamin)

0.3.0

  • Elm 0.17 support
  • swap port and EmptyAction are gone. Enable this loader and it just works.
  • Incoming ports still work after hot swapping

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.