Nested `Elm` variable when using webpack2

[zgohr]

I tried to reproduce this with the included webpack2 example but I couldn't get that one running.

The issue is that using webpack2 seems to nest the Elm javascript variable.

Example (working code):

var Elm = require('./Main')
Elm.Elm.Main.init({node: document.getElementById('main')});

Found this while upgrading elm-select here

[sporto]

Same here https://github.com/sporto/elm-webpack-serve-repro/blob/master/src/app.js#L5

[eeue56]

PRs welcome

[RaniSputnik]

Have confirmed this is also happening with WP4 and Elm 0.19.

[embryCODE]

For those of us using es6 modules, this did the trick for me:

import { Elm } from '../elm/src/Main.elm'

Elm.Main.init({ node: document.getElementById('elm') })

As noted above, you can also do this:

import Elm from '../elm/src/Main.elm'

Elm.Elm.Main.init({ node: document.getElementById('elm') })

[tsopeh]

import { Elm } from '../elm/src/Main.elm'

Elm.Main.init({ node: document.getElementById('elm') })

This also worked for me, using webpack 5 with Typescript and Elm 0.19.1