elm-community / elm-webpack-starter

Boilerplate for developing Elm apps on Webpack

Home Page:http://elm-community.org/elm-webpack-starter/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Is it possible to keep non-Elm source vs Elm source in different directories?

danneu opened this issue · comments

commented

I borrowed the Webpack config heavily from your work on this project when building a Yeoman generator for Elm (danneu/generator-elm).

elm-webpack-starter's src/ folder contains not just Elm source, but also all of the static entry-points and static files, like index.html, index.js, css, and images. elm-webpack-loader does the same in its example project.

In my Yeoman generator, I wanted the src/ folder to contain only Elm source files. Instead, I created a new top-level folder static/ and moved index.html/index.js/css/images there. I changed webpack-dev-server's --content-base from src/ to static/.

However, I noticed that webpack-dev-server only picks up changes to the src/Main.elm file which is required from my static/index.js entry-point (source).

I'm guessing that the rest of my files in src/ aren't being watched because --content-base static/ only watches that folder tree even though static/index.js requires src/Main.elm which imports other Elm files from the src/ folder?

Is that why you mixed Elm and non-Elm source in src/ to begin with, so --content-base will pick up all changes?

I think the src/ and static/ separation would be a good improvement for this project, but I couldn't figure out the webpack config incantation to make it work.

Yes. I've modified my project structure like so:

${project_root}
├── elm-package.json
├── package.json
├── src
│   ├── elm
│   │   ├── Main.elm
│   │   ├── etc...
│   └── static
│       ├── index.html
│       ├── index.js
│       └── styles
│           └── main.scss
└── webpack.config.js

First you need to modify the source directories in your elm-package.json to point to the correct location:

...
    "source-directories": [ "src/elm"],
...

Then update the configurations in webpack.config.js to point to the new src/static locations. The important lines are 39, 57, 93, 116, and 120 in the example config.

Looks good @joshuata. I went with a minimal structure for starters, but I may follow your org in a future release. Thanks!