nextjsでタグマネージャーを導入する際に、本番環境、検証環境、開発環境といった環境ごとにコンテナのIDを指定することにした。
ただnextjsでは用意されたenvと適応コマンドがすでに割りついているっぽい。
| 環境ファイル | 役割 |
|---|---|
| .env.local | next dev |
| .env.development | next dev |
| .env.production | next build/next start |
参考:Next.jsで環境ファイル(env)別ビルドを行う 参考:Add support for custom environments
今回は、同じnext startで3つの環境を作成したいけど、前述の通りそれだと.env.productionしか呼び出すことができない。
そこでenv-cmdを使用する。
#Using custom env file path To use a custom env filename or path, pass the flag. This is a major breaking change from prior versions < 9.0.0-f
とあるように、アプリをビルド/実行するときに特定の.envファイルを選択することができるパッケージ。
.env.prod
.env.stag
.env.local
と3つのEnvを用意し下記のようなScriptを作成すれば、それぞれのScriptごとに対応するEnvを読みに行ってくれる。
"prod": "env-cmd -f .env.prod next build && next start",
"stag": "env-cmd -f .env.stag next build && next start",
"local": "env-cmd -f .env.local next build && next start",