Next.jsでenvファイルを使う

やること

envファイルをNext.jsで使えるようにする。

必要パッケージインストール

dotenvをインストール

yarn add dotenv

.env作成

TEST = HOGEHOGE

next.config.js作成

next.config.js

require('dotenv').config()

module.exports = {
  env: {
    TEST: process.env.TEST,
  },
}

読み込む

pages/index.js

export default () => <p>process.env.TEST:{process.env.TEST}</p>

おわり

Next.jsの記事が少ないと感じているので、ちょっとしたことでも投稿していこうと思った。