Nuxt.jsアプリケーションをHerokuにデプロイする

公開日時
更新日時

Nuxt.jsアプリケーションの確認環境が欲しかったのでHerokuにデプロイすることにした。

公式ドキュメントに沿って以下の環境変数を設定。

heroku config:set NPM_CONFIG_PRODUCTION=false
heroku config:set HOST=0.0.0.0
heroku config:set NODE_ENV=production

typescriptプロジェクトだったのでProcfileには以下を記述。

web: yarn run start

1点、vueコード内で[[process.env.SAMPLE_ENV]]と書いていた部分がNODE_ENV=productionの場合だとundefinedになってしまいハマった。

クライアントサイドで使用する環境変数は[[nuxt.config.js]]のenvに追加しておく必要があった。

const config: Configuration = {
  env: {
    SAMPLE_ENV: process.env.SAMPLE_ENV
  }
}

これでHerokuで確認できるようになった。

参考


Related #js