できない.dev

import.meta

別名: import.meta.url / import.meta.dirname / import.meta.env

ES モジュールの中だけで使える特別な式で、実行中のモジュール自身の情報を持つオブジェクトを返す。
Node.js では import.meta.url や import.meta.dirname、Vite では import.meta.env を通して値を読む。

公開:

定義

import.meta は、ES モジュールのコードの中で「今実行しているモジュール自身」の情報を取り出すための特別な式である。import は予約語なので通常のプロパティアクセスではなく専用の構文として扱われ、中身のオブジェクトは実行環境が用意する。
モジュールの外で使うと構文エラーになる。

詳細

ブラウザと Node.js では import.meta.url がモジュールの URL を返し、Node.js では file: で始まる URL になる。
Node.js 21.2.0(20 系は 20.11.0)以降では import.meta.dirname と import.meta.filename も使え、CommonJS の __dirname と __filename の代わりになる。

Vite はこのオブジェクトに独自の値を足しており、import.meta.env からモードや環境変数を読む。
これらの値は開発中はグローバル変数として定義され、ビルド時には定数へ静的に置き換えられる。

よくある誤解

  • import.meta.env は Node.js の process.env と同じもの: 同じではない。
    Vite が用意する値で、.env の変数のうちクライアントのコードに公開されるのは VITE_ で始まるものだけである。
  • どのファイルでも使える: CommonJS として読み込まれるファイルでは使えない。
    拡張子を .mjs にするか、package.json の "type": "module" で ES モジュールとして扱わせる必要がある。

関連

ES モジュールで __dirname が使えない場合は Node.js の ESM で「__dirname is not defined」が解決できない、Vite で値が読めない場合は Vite で環境変数(import.meta.env)が読み込めない を参照する。
モジュール方式そのものは ESM にまとめている。

この記事は役立ちましたか?