Incremental adoption and compiled code duplication


I’d like to try out Elm in an existing app (a rails app) by integrating “widgets” as described here: JavaScript Interop · An Introduction to Elm

I’m a little unsure of my strategy so I’m submitting this for feedback.

This is how I plan to do load the code (for any page integrating a “widget”)

<!-- A server will render this HTML -->
<h3>A counter</h3>

<div id="elm-counter"></div>

<!-- Below generates a script tag pointing to a compiled elm module -->
<%= javascript_include_tag 'elm/dist/Counter.js' %>

<script defer>
        node: document.getElementById('elm-counter')

<h3>Rest of the page goes here</h3>

To make the Elm.ModuleName.init workflow possible, I compile my Elm files with a script similar to this:

find ./src/*.elm  | xargs -IFILE elm make FILE --optimize --output ./dist/FILE.js

However, I then get 100k files for each module.

> find ./dist/ | xargs -n1 du -sh
200K    ./dist/
108K    ./dist/Counter.js
88K     ./dist/Widget.js

Here, Counter.js and Widget.js share mostly the same code, 99% of the file size is duplication from elm make

Is there a smarter way to proceed here with this workflow?

I suppose one would want to load the least amount of modules this way to prevent bloat, preferably one?

Hi and welcome to Elm. You need to pass all Elm modules space separated to elm make to reuse Elm’s runtime. E.g. elm make ModuleA.elm ModuleB.elm …. Good luck!

1 Like

BTW elm make only needs to know entry points to Elm modules that expose main function with program. You don’t need to pass dependencies of those modules.

Many thanks, that’s much better! (phew :sweat_smile:)

I somehow missed the hint at the top of elm make --help, doh!

I think I’ll keep modules requiring a main at the top folder level, then shared code in sub-folders.

Then I should be able to compile mostly that way.

elm make ./src/*.elm --output ./dist/Main.js

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.