# Incremental adoption and compiled code duplication

**URL:** <https://discourse.elm-lang.org/t/incremental-adoption-and-compiled-code-duplication/7964>\
**Category:** Learn\
**Created:** [December 4, 2021, 7:40pm UTC](https://discourse.elm-lang.org/t/incremental-adoption-and-compiled-code-duplication/7964 "2021-12-04T19:40:54Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![benjamin-thomas](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.elm-lang.org/benjamin-thomas/32/3869_2.png) [@benjamin-thomas](https://discourse.elm-lang.org/u/benjamin-thomas)\
**Post date:** [December 4, 2021, 7:40pm UTC](https://discourse.elm-lang.org/t/incremental-adoption-and-compiled-code-duplication/7964/1 "2021-12-04T19:40:54Z")

</div>

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](https://guide.elm-lang.org/interop)

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”)

```auto
<!-- 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:

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

```

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

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

---

<div class="post-metadata">

**Author:** ![akoppela](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.elm-lang.org/akoppela/32/250_2.png) [@akoppela](https://discourse.elm-lang.org/u/akoppela)\
**Post date:** [December 4, 2021, 7:59pm UTC](https://discourse.elm-lang.org/t/incremental-adoption-and-compiled-code-duplication/7964/2 "2021-12-04T19:59:02Z")

</div>

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!

---

<div class="post-metadata">

**Author:** ![akoppela](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.elm-lang.org/akoppela/32/250_2.png) [@akoppela](https://discourse.elm-lang.org/u/akoppela)\
**Post date:** [December 4, 2021, 8:04pm UTC](https://discourse.elm-lang.org/t/incremental-adoption-and-compiled-code-duplication/7964/3 "2021-12-04T20:04:52Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![benjamin-thomas](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.elm-lang.org/benjamin-thomas/32/3869_2.png) [@benjamin-thomas](https://discourse.elm-lang.org/u/benjamin-thomas)\
**Post date:** [December 4, 2021, 8:48pm UTC](https://discourse.elm-lang.org/t/incremental-adoption-and-compiled-code-duplication/7964/4 "2021-12-04T20:48:49Z")

</div>

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

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.

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

```

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex035/uploads/elm_lang/original/1X/50a05e53677a2c3b47776d7abd0f113eb50193a1.png) [@system](https://discourse.elm-lang.org/u/system)\
**Post date:** [December 14, 2021, 8:49pm UTC](https://discourse.elm-lang.org/t/incremental-adoption-and-compiled-code-duplication/7964/5 "2021-12-14T20:49:01Z")

</div>

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