Next.js での環境変数の参照方法
更新日:2025/02/02

環境変数の使用方法
環境変数は process.env.環境変数名
で参照できます。
NEXT_PUBLIC_の使い方
通常、環境変数はサーバーサイドでのみアクセス可能ですが、NEXT_PUBLIC_
を付けることで、クライアントサイドのJavaScriptからも安全にアクセスできるようになります。
クライアント側で使用する場合
NEXT_PUBLIC_
をつけた変数のみ参照可能NEXT_PUBLIC_
がないとundefined
になる
サーバー側で使用する場合
NEXT_PUBLIC_
の有無に関わらず参照可能
環境変数が参照されるファイルの種類
Next.js では、以下の .env
ファイルが自動的に参照されます。
ファイル名 | 役割 |
---|---|
.env | 基本の環境変数を定義 |
.env.local | ローカル開発専用(.gitignore 推奨) |
.env.development | next dev 実行時に適用 |
.env.production | next build や next start 実行時に適用 |
.env.test | NODE_ENV=test のときに適用 |
- 優先順位
.env.local
>.env.環境名
>.env
(.env.local
が最優先)

-
検索
(例) debug search etc.. -
カテゴリー
新規記事
SEOサンプル記事
話題のキーワードから探す