📁

.mjs とはなんぞや?!

2022/06/01に公開

はじめに

npmで処理を追加する際に.mjsに出会ったが、初めてみたので少し調べておく。

.mjsとは

mdnには...

どのファイルがモジュールで、どのファイルが通常の JavaScript であるかを明確にすることができます。
これにより、Node.js のようなランタイムや Babel のようなビルドツールで、モジュールファイルがモジュールとして解析されるようになります。

と書いてます。
要はNode.jsなんかで、パース時にそのファイルがESM/CJSどっちなのかを明確にする方法ということですかね。.mjsのファイルは ESMとして扱われるようです。

あくまで開発環境段階での用途みたいです。↓

ブラウザでモジュールを正しく動作させるためには、サーバーが text/javascript などの JavaScript MIME タイプを含む Content-Type ヘッダでモジュールを提供していることを確認する必要があります。そうしないと、"The server responded with a non-JavaScript MIME type" のような厳格な MIME タイプチェックエラーが表示され、ブラウザは JavaScript を実行しません。ほとんどのサーバーでは、.js ファイルにはすでに正しい MIME タイプが設定されていますが、.mjs ファイルにはまだ設定されていません。

加えて、

通常の JavaScript ファイルに .js を使用するのと比較して、モジュールに .mjs を使用することの明確さを本当に重視しているが、上記の問題に直面したくない場合は、開発中に .mjs を使用し、ビルドステップで .js に変換することをおすすめします。

とのことなので、.mjsでサーバーにアップする用途はあまりないでしょう。(設定すればできますが...)

もっと詳しく

.mjsが採択された背景からこちらで解説されてます。↓
https://blog.jxck.io/entries/2017-08-15/universal-mjs-ecosystem.html

参考サイト

https://developer.mozilla.org/ja/docs/Web/JavaScript/Guide/Modules#余談_—_.mjs_対_.js

Discussion