Using custom HTML with elm reactor, or another dev server, in 0.19

Question

As this answer shows it's possible in Elm 0.18 to run elm reactor with a custom HTML file if this snippet is included in the HTML file:

<script src="/_compile/src/Main.elm"></script>
<script>
  runElmProgram();
</script>

In 0.19, however, it doesn't seem like the _compile directory exists or is served anymore. Is there another way to accomplish the same, preferably with elm reactor so as to be able to leverage existing IDE support etc., but I'm interested in any kind of "dev server" solution.

Answer 1

It's possible to use elm-live, which needs to be invoked with a bit more ceremony. It defaults to serving index.html but can be configured to serve a different html page using the command line option -s, --start-page [STARTPAGE] (Thank you for this tip, @kaskelotti)

The equivalent snippet needed in index.html to start your elm program is:

<script src="build/elm.js"></script>
<div id="elm"></div>
<script>
  var app = Elm.Main.init({
    node: document.getElementById('elm')
  });
</script>

and to start it run the following command in a terminal:

elm-live src/Main.elm -- --debug --output=build/elm.js

The script path in the HTML file must be the same as the one passed as output on the command line.

Unlike elm reactor, elm-live will not display compiler errors in the browser, but instead prints it to the terminal, and will continue to serve the last successfully compiled output.

It also randomly hangs and crashes...