やりたいこと
Laravelの.envファイルで設定した環境変数を、Vueのコンポーネントの中で取得する。
動作環境
PHP 7.4.9
@vue/cli 4.5.4
困った
.env
SAMPLE_WORD="sample!!!"
SampleComponent.vue
console.log("サンプル")
console.log(process.env.SAMPLE_WORD)
console.log("サンプル")
envで確かに設定した環境変数なのに「undefined」になる。
サーバを立ち上げ直しても変わらず…
こうやったら上手くいった
環境変数の変数名を「MIX_hogehoge」というようにMIXから始まるようにします！
.env
# before
SAMPLE_WORD="sample!!!"
# after
MIX_SAMPLE_WORD="sample!!!"
SampleComponent.vue
console.log("before")
console.log(process.env.SAMPLE_WORD)
console.log("after")
console.log(process.env.MIX_SAMPLE_WORD)
一度サーバを立ち上げなおして再度見てみると…
「MIX」をつけたほうは、ちゃんと「sample!!!」と表示されてますね。
参考にさせていただいた記事
助かりました、ありがとうございますmm
おしうみなおき様 vue側でlaravelのenvファイルの値を使用する方法