elm-make is a tool for building Elm projects. It takes .elm files and compiles them to JavaScript or HTML. If we compile to HTML, elm-make will put the entire JavaScript code that you saw in elm.js file inside a <script> tag. It’s best practice to keep JavaScript code in a separate file due to ease of testing, code organization, and reusability. So I recommend compiling all Elm code to a JavaScript file and including it in index.html.

$ elm-make HomePage.elm --output elm.js


$ elm-make HomePage.elm --output elm.html

By default, elm-make prints only errors not warnings. If you want to see the warnings too, run it with --warn flag like this:

$ elm-make HomePage.elm --output elm.js --warn

========================== WARNINGS =============================

--------------- missing type annotation ------------ HomePage.elm

Top-level value `main` does not have a type annotation.

17| main =
I inferred the type annotation so you can copy it into your code:

main : Html a

If you don’t see a warning message, delete the build-artifacts directory located inside the beginning-elm/elm-stuff directory and run the command again.

A warning message indicates that something may be inaccurate with our program. Because warnings don’t prevent an Elm program from compiling successfully, we are not required to address them. However, it’s best practice to fix them whenever Elm points them out. If we don’t, there’s a higher chance our program will run into an issue down the line.
An error message indicates that something is definitely wrong with our program. We must fix all errors before Elm can successfully compile our code.
Back to top

New chapters are coming soon!

Sign up for the Elm Programming newsletter to get notified!

* indicates required