Nuxt3でのビルド後の環境変数の適用(node-server)

code on a screen NuxtJS
Photo by Markus Spiske on Pexels.com
この記事は約2分で読めます。

Nuxt3にはdotenvが組み込まれていて、プロジェクトトップにある.envファイルを読み込み環境変数として使用することができます。

Nuxt3のruntimeConfigで環境変数を設定する
はじめに nuxt3には、実行時に設定値をロードするための仕組みとしてruntimeConfigというものがある。コンポーネント内からはuseRuntimeConfigや$configで値にアクセスすることができる。サーバサイド(priva...

devモード時は気にしませんが、ビルド後に例えばnode-serverで実行するような場合、利用者側でnode-server起動時に環境変数を適用する責任があるようです。

Runtime Config · Nuxt Advanced
Nuxt provides a runtime config API to expose configuration and secrets within your application.

どういうことか確認してみます。

環境nuxt3 rc11、node v16.18.0、npm 8.19.2

 本記事作成時、Nuxt3はまだベータリリースのため動作が変わる可能性もあります。

例えば、通常のnode-server向けビルドを見てみます。

npm run buildすると以下のような実行スクリプトが生成されます。

上記ファイル内のコードを見ると、_runtimeConfigの内容が、overrideConfig関数で上書きされ、最終的にuseRuntimeConfigの戻り値となっていることが分かります。.envの内容を適用するには、実行時に.envをロードし環境変数として定義してあげる必要があることが分かります。

よって、例えばLinux環境のbashでは、以下のようにして環境変数を読み込みませてnodeを実行すれば良さそうです。

参考リンク

コメント

タイトルとURLをコピーしました