import.meta
Baseline
広く利用可能
この機能は広く実装されており、多くのバージョンの端末やブラウザーで動作します。2020年1月以降、すべてのブラウザーで利用可能です。
import.meta オブジェクトはコンテキスト固有のメタデータを JavaScript のモジュールに公開します。これには、モジュールの URL のようなモジュールに関する情報が含まれています。
構文
import.meta
値
import.meta オブジェクトはホスト環境によって生成され、拡張可能な null プロトタイプオブジェクトとして、すべてのプロパティが書き込み可能、構成不可、列挙可能となります。仕様では定義すべきプロパティは指定されていませんが、ホストは通常次のプロパティを実装します。
解説
import.meta 構文は、キーワード import、ドット、識別子 meta で構成されます。 import は識別子ではなく予約語であるため、これはプロパティアクセサーではなく、特別な式構文です。
import.meta メタプロパティは JavaScript でモジュール内で利用できます。モジュール外(モジュール内の 直接 eval() を含む)で import.meta を使用すると構文エラーになります。
例
>クエリー引数を渡す
import指定子で引数を指定することで、モジュール固有の引数渡しが可能になります。これは、アプリケーション全体の window.location (Node.js では process.argv 経由)から引数を取得する手法を補完するものです。例えば、以下の HTML では、
<script type="module">
import "./index.mjs?someURLInfo=5";
</script>
index.mjs モジュールは、import.meta を通じて someURLInfo 引数を取得できます。
// index.mjs
new URL(import.meta.url).searchParams.get("someURLInfo"); // 5
ファイルが別のファイルをインポートする場合も同様です。
// index.mjs
import "./index2.mjs?someURLInfo=5";
// index2.mjs
new URL(import.meta.url).searchParams.get("someURLInfo"); // 5
Node.js の ES モジュール実装は、後者の例のようにクエリー引数(またはハッシュ)を含むモジュール指定子の解決に対応状況を示しています。ただし、 CLI コマンド(例えば node index.mjs?someURLInfo=5)でモジュールを指定する場合、クエリーやハッシュは使用できません。 CLI のエントリーポイントは CommonJS に似た解決モードを採用しており、パスを URL ではなくファイルパスとして扱うためです。エントリポイントモジュールに引数を渡すには、同様に CLI 引数を使用し、 process.argv を通じて読み取ってください(例: node index.mjs --someURLInfo=5)。
現在のファイルからの相対パスによるファイルの解決
Node.js の CommonJS モジュールでは、現在のモジュールを含むフォルダー内の絶対パスを保持する __dirname 変数が存在し、相対パスの解決に有用です。一方、ESモジュールでは import.meta を除きコンテキスト変数を使用することはできません。そのため、相対ファイルを解決するには import.meta.url を使用することができます。これはファイルシステムパスではなく URL が使用されています。
使用前 (CommonJS):
const fs = require("fs/promises");
const path = require("path");
const filePath = path.join(__dirname, "someFile.txt");
fs.readFile(filePath, "utf8").then(console.log);
使用後 (ES modules):
import fs from "node:fs/promises";
const fileURL = new URL("./someFile.txt", import.meta.url);
fs.readFile(fileURL, "utf8").then(console.log);
仕様書
| 仕様書 |
|---|
| ECMAScript® 2027 Language Specification> # prod-ImportMeta> |
ブラウザーの互換性
ブラウザー互換性一覧表を表示するには、JavaScript を有効にしてください。