node.js 8.5.0でオプション付きでes modulesがサポートされた。
Add support for ESM. This is currently behind the --experimental-modules flag and requires the .mjs extension. node --experimental-modules index.mjs #14369
フラグ付きでもESMが利用可能になったのは、はnode.jsにおいて最大の課題であったESMとCJSを識別する方法が決着したからである。
.mjs とは何か、またはモジュールベース JS とエコシステムの今後 | blog.jxck.io
.mjsによってESMとCJSが識別できるようになり、ESMとCJSの相互運用問題が解決された。
これによってnode.jsのHostResolveImportedModuleの仕様が固まり、実装されたのだ。
HostResolveImportedModuleについては過去調べたことがあった。
ES2015 ModuleのLoaderの件
ESではimport a from "xxx"の"xxx"は環境依存で、それぞれの環境でHostResolveImportedModuleを実装する仕様になっている。
下のドキュメントを読んでポイントをつかんでおこうと思った。
上記を参考にしたと思われる良記事があったのでそれも読んだ。
2017-08-31 Node.jsのES Modulesサポートの現状確認と備え
読後今後どうすればよいかをまとめると
- まずは自サーバのnginxに
.mjsのMIME Typeapplication/javascriptを追加する。 - 拡張子は.mjsで実装する。nodeでは当面
--experimental-modulesフラグを付けて動かす。 - ブラウザはモジュールを
<script type="module">で書く。srcはもちろん.mjs。 フォールバックを用意する(ブラウザ)
- rollup.jsでバンドルして
.jsを用意 <script nomodule src="xxx.js">を入れる
- rollup.jsでバンドルして
フォールバックを用意する(node)
- rollup.jsでバンドルして
.jsを用意 - package.jsonを修正("main"に
.js指定していれば拡張子を取っておく)
- rollup.jsでバンドルして
だろうか。
ブラウザ側は今のところフラグなしでESMをサポートしているのはChromeとSafariだけのようなので、フォールバックはしばらくは必要ですな。。
nodeはESMもCJSも読み込めるし、ライブラリを提供するのでなければもう.mjsでいいかなと。。
あとdynamic import (import())もサポートされているようなので試してみようかな。。