やりたいこと

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ファイルの値を使用する方法