Next.js で .env ファイルから環境変数を読み込んで使う時にちょっと迷ったのでやり方をメモ代わりに書いとく.
やり方
基本的なやり方は
って感じ.
実際にやってみる
Next.js のアプリケーションは既にある前提でやります.
まず dotenv を追加
yarn add dotenv
プロジェクトルートの.envファイルに適当に環境変数のキーバリューのセットを書いとく
ADMIN_API_HOST=127.0.0.1:8080
プロジェクトルートに next.config.js
というファイルを作って以下のような内容にする.
require('dotenv').config(); module.exports = { env: { // Reference a variable that was defined in the .env file and make it available at Build Time ADMIN_API_HOST: process.env.ADMIN_API_HOST, }, }
これでNext.jsのアプリケーション内から値を読めるようになった.
使う時は process.env.ADMIN_API_HOST
みたいな感じで値にアクセスできる.