Elm-Live: Automatic Browser Refresh

Intro

This post is meant to document my understanding for supporting auto-refresh behavior for a browser when updating Elm files.

Steps

Given that the elm file that I’m working on is named “Main.elm”, the following needs to be done:

1: create/update index.html with the following:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="style.css">
    <script src="main.js"></script>
  </head>
  <body>
    <script>
      Elm.Main.fullscreen();
    </script>
  </body>
</html>

2: Enter the following command on whatever command-line interface

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

Note:
After performing the steps above, every time a save operation occurs, an automatic refresh should also occur on the browser displaying the webpage (i.e. index.html)

Conclusion

In conclusion, I have documented the two steps required for auto refresh support when saving updates to an Elm file.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: