Weird compile error when using two elm apps with webpack

Learn
1

The source code is here. The main file is main.ts. I have been using a single Elm app named Main, and now I’m adding another one named Css which controls a <style> element in <head>. When I run webpack, I see this error message:

image
image1605×1208 1.16 MB

This is how I am importing the Elm applications:

var M = require('./Main.elm');
var C = require('./Css.elm');


let app = M.Elm.Main.init({
	node: document.getElementById('ui'),
});


let cssApp = C.Elm.Css.init({
	node: document.getElementById('style'),
});

But when I run this, it successfully compiles:

$ elm make src/Css.elm --output=/dev/null

Maybe I should build both apps into a single file and import that, but I’m not sure how to do that with Webpack.

2

You can use elm-webpack-loader to do this.

See this section: GitHub - elm-community/elm-webpack-loader: Webpack loader for the Elm programming language..

3

@dmy it still doesn’t work. I now have this in my webpack config:

{
	test: /\.elm$/,
	include: path.resolve(__dirname, 'src'),
	exclude: path.resolve(__dirname, 'node_modules'),
	use: {
		loader: 'elm-webpack-loader',
		options: {
			files: [
				'src/Main.elm',
				'src/Css.elm',
			].map(name => path.resolve(__dirname, name)),
		},
	},
}

And I now have this in main.ts:

let Elm = require('./Main.elm');


let app = Elm.Main.init({
	node: document.getElementById('ui'),
});


let cssApp = Elm.Css.init({
	node: document.getElementById('style'),
});

I still get the exact same error.

4

This has nothing to do with compiling two apps. You can reproduce by just running:

elm make src/Css.elm

Your second module is named Css.elm but you have rtfeldman/elm-css installed that also has a Css module actually imported in your own module:

There is a conflict, and unfortunately, a regression in Elm 0.19.1 makes the error really not obvious:

Just rename your Css.elm module to something else.

1 Like
5

Thank you so much @dmy, it works now!


I apparently have
image

1 Like
6

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