Incremental adoption and compiled code duplication

Learn
1

Hello,

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>
    Elm.Counter.init({
        node: document.getElementById('elm-counter')
    });
</script>

<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?

2

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
3

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.

4

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
5

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