vue cli3で作成したプロジェクトの環境変数設定

2019年6月17日2020年3月7日

環境変数の使用方法

プロジェクトルート直下にある.envファイルに環境変数を記述します。 .envファイルに記述するキーはVUE_APP_をプリフィックスとしないと読み込まれません。

.envファイルを編集した際にはnpm run serveを再実行しないと変更内容が反映されないので注意が必要です。

USE_MOCK=true #読み込まれない
VUE_APP_USE_MOCK=true  #読み込まれる

コード中ではprocess.env.{環境変数名}で値にアクセスできます。