【Next.js】ENVの使い方

ファイルの場所

ルートフォルダ

ファイルの種類

全体共通の.envファイルと、環境別の.env.production.env.localがある。それぞれの違い。

  • .env

全体共通の定数を持てるファイル。

  • .env.production

npm run buildで生成した本番用ソースで用いられるenvファイル。

  • .env.local

npm run devで走らせる開発環境で用いられるenvファイル。

APIのContextを環境で切り替えるシチュエーションが一番多そう。

定数の使い方

process.env.定数名

定数宣言の注意点

  • 定数の命名法はアッパースネークケース

ABCD_EFGのような命名をする。

  • prefixでNEXT_PUBLIC_を付けないと、クライアント側では使えない。

特に、SPAでビルドする場合はNEXT_PUBLIC_を定数名の頭に付けないと使えない。
SSRの場合は、付けない場合はサーバーサイドでのみ使用可能な定数となる。