parcel-bundler/parcel: 📦🚀 Blazing fast, zero configuration web application bundler というビルドツールがある。何気なく公式のドキュメントを読んでいたら、Elm でも使えるということで使ってみた。

このページ ¹に Elm での使い方が簡単に書いてある。まだ内容が少ないのでコントリビュートチャンスかもしれない。でも(Elmが)マイナ言語なので、需要も少ないかもしれない。

使うまで

🚀 Getting Started を参考に使えるようにする。わたしは yarn でやった。

yarn global add parcel-bundler
mkdir parcel-test
yarn init -y

parcel-test の直下に index.html と index.js と Main.elm を作る。

<!-- index.html -->

<html>
  <body>
    <main></main>
    <script src="./index.js"></script>
  </body>
</html>

// index.js

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

Elm.Main.init({
  node: document.querySelector('main')
})

-- Main.elm
module Main exposing (main)

import Browser
import Html exposing (h1, text)

main =
  h1 [] [ text "Hello, Elm!" ]

そして、 parcel index.html とやるとよしなに parcel がしてくれる。

index.js の from ... のパスを書き換えれば ./src/Main.elm とかにファイルをおいても当然ビルドできる。elm reactor とかでも普通に開発に使えるが、とりあえず導入が簡単すぎて感動したので簡単にメモをした。