Webpack loader for the Elm programming language.
JavaScript Elm HTML
Latest commit 06a6d07 Feb 25, 2017 @eeue56 eeue56 committed on GitHub Merge pull request #103 from ryani33/fix-deprecated-warning
fix deprecated warning


Elm loader Version Travis build Status AppVeyor build status

Webpack loader for the Elm programming language.

It is aware of Elm dependencies and tracks them. This means that in --watch mode, if you require an Elm module from a Webpack entry point, not only will that .elm file be watched for changes, but any other Elm modules it imports will be watched for changes as well.


$ npm install --save elm-webpack-loader


Documentation: Using loaders

In your webpack.config.js file:

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

See the examples section below for the complete webpack configuration.


cwd (default null) Recommended

You can add cwd=elmSource to the loader:

var elmSource = __dirname + '/elm/path/in/project'
  loader: 'elm-webpack?cwd=' + elmSource

You can use this to specify a custom location within your project for your elm files. Note, this will cause the compiler to look for all elm source files in the specified directory. This approach is recommended as it allows the compile to watch elm-package.json as well as every file in the source directories.

maxInstances (default 4)

You can add maxInstances=8 to the loader:

  loader: 'elm-webpack?maxInstances=8'

Set a limit to the number of maxInstances of elm that can spawned. This should be set to a number less than the number of cores your machine has

Cache (default false)

You can add cache=true to the loader:

  loader: 'elm-webpack?cache=true'

If you add this, when using npm run watch, the loader will only load the dependencies at startup. This could be performance improvement, but know that new files won't be picked up and so won't be watched until you restart webpack.

This flag doesn't matter if you don't use watch mode.

Upstream options

All options are sent down as an options object to node-elm-compiler. For example, you can explicitly pick the local elm-make binary by setting the option pathToMake:

  loader: 'elm-webpack?pathToMake=node_modules/.bin/elm-make',

For a list all possible options, consult the source.



You can find an example in the example folder. To run:

npm install
npm run build

You can have webpack watch for changes with: npm run watch

You can run the webpack dev server with: npm run dev

For a full featured example project that uses elm-webpack-loader see pmdesgn/elm-webpack-starter .


Webpack can complain about precompiled files (files compiled by elm-make). You can silence this warning with noParse. You can see it in use in the example.

  module: {
    loaders: [...],
    noParse: [/.elm$/]



Watching is now done based on elm-package.json, faster startup time via @eeue56


Add support for --debug via node-elm-compiler


Allow version bumps of node-elm-compiler.


Upgrade to latest node-elm-compiler, which fixes some dependency tracking issues.


Fix potential race condition between dependency checking and compilation.


Use node-elm-compiler 4.0.1+ for important bugfix.


Use node-elm-compiler 4.0.0+


Pass a real error object to webpack on failures.


Support Elm 0.17, and remove obsolete appendExport option.


Change warn to be a pass-through compiler flag rather than a way to specify logging behavior.


Initial stable release.