5

I have elm reactor serving my pages while developing. After saving my code changes, I am running elm make src/Main.elm --output=main.js. Is there a way to auto elm make on save and see the changes on the browser?

I'm using elm 0.19

C.S.Reddy Gadipally
  • 1,718
  • 11
  • 22
  • I think it depends on your editor... what are you using? – 0xc14m1z Apr 24 '19 at 06:33
  • Hmmm... Shouldn't elm reactor already do hot reload? You should not need to use elm make with it. Simply starting elm reactor in your project root should be enough. – kaskelotti Apr 24 '19 at 06:39
  • @kaskelotti The `elm reactor` is for the `.elm` file only. In OP's case., he wants to build this file to `.js` and inject it to HTML file. I am doing it manually too. – bird Apr 24 '19 at 06:52
  • 2
    Possible duplicate of [Using custom HTML with elm reactor, or another dev server, in 0.19](https://stackoverflow.com/questions/52702961/using-custom-html-with-elm-reactor-or-another-dev-server-in-0-19) – glennsl Apr 24 '19 at 07:18
  • OK. Then it's the same case as glennsl already mentioned. elm live should to the trick. – kaskelotti Apr 24 '19 at 07:56

2 Answers2

5

Update for 2021: These days I would just use Parcel JS. It support hot reloading and is easy to setup in general: https://parceljs.org/languages/elm/

Old answer: I had the same issue.

At first I used a custom script in my Atom environment, but then I found Elm Live: https://github.com/wking-io/elm-live.

Does all you ask. Highly recommended! Automatically recompiles, hot reloads and opens the browser window if not opened.

First install with NPM: (I used some issues with the latest version)

npm install --save-dev elm elm-live

Then use the command instead of the one you're using now:

elm-live src/Main.elm --open -- --output=main.js

Josh Buedel
  • 1,853
  • 16
  • 41
Tails
  • 636
  • 7
  • 16
  • 1
    Hot reloading is only supported in [v4](https://github.com/wking-io/elm-live/blob/master/Changelog.yaml#L4) currently in alpha. Version 3 and older only supports live reloading which is not the same. You should install `elm-live@next` and use the `--hot` flag if you want hot loading. Since it's in alpha there might be issues. – ivarni Aug 21 '19 at 08:28
  • The above-referenced Parcel link has moved to https://parceljs.org/languages/elm/ , and this video fills in a few missed instructions: https://youtu.be/5EiFnXqcl28 – Abel Wenning Nov 21 '21 at 08:51
1

I think you'll need to use a proper build environment to get hot reloading. The one I created and use is at https://github.com/simonh1000/elm-webpack-starter

Simon H
  • 20,332
  • 14
  • 71
  • 128