@curtissimo/elm-hot

This package provides the core infrastructure needed for doing hot code swapping in Elm. It supports Elm 0.19.0 and 0.19.1 only.

This low-level package is intended for authors of Elm application servers.

This package is primarily maintained for use with Parcel and its built-in support for Elm which uses this package.

The goal of this package is to provide a reusable core that can be used to provide hot code swapping support in a variety of environments.

Installing elm-hot core API

This really should only be a development dependency.

$ npm install --save-dev elm-hot

Testing

These tests run against both Elm 0.19.0 and 0.19.1. Switching out binaries and modifying the elm.json file is a little bit of a chore, but do-able.

These integration tests are sloooooow, like it takes five minutes slow.

Our goals with testing are:

• Provide dockerized testing environments to isolate the various versions of the Elm compiler
• Increase the speed of the tests because ... well, five minutes ... that's a long time

Core API

function inject(str)

Injects the hot code swapping functionality into a compiled Elm app.

• Takes the Javascript code emitted by the Elm compiler as an input string
• Returns a string containing the injected code ready to be evaluated in the browser.

Example of how the core API could be used

const elmHot = require('elm-hot');
const {compileToStringSync} = require('node-elm-compiler');
const injectedCode = elmHot.inject(compileToStringSync(["src/Main.elm"], {}));

In order to provide something similar to webpack-dev-server with hot module reloading, an application server could be developed to do the following:

• Serve a modified version of the developer's index.html to receive push events from the server
• Watch .elm files on disk for changes
• Push a "file changed" event to the client notifying it that it should fetch new code from the server
• When the client receives the event:
  • Fetch the new code (the server will re-compile the Elm code and use elm-hot to inject the hot-code-swapping logic)
  • The client deletes the old Elm object and injects the new code from the server

Keith Lazuka implemented something similar to this for the integration tests. See test/server.js and test/client.js for inspiration.

Attribution

This is an active fork of Keith Lazuka's elm-hot GitHub repository.

Elm hot code swapping is based on the work of Flux Xu's elm-hot-loader.