Add Laravel .env variable to Vue component

Question

I would like to get access to an .env variable using Vue JS.

In my .env file I have added the 'MIX_' prefix to the var.

MIX_VAR=key

And then in the vue component, I have in the created():

console.log(process.env.MIX_VAR);

I keep getting undefined as the result.

I have tried clearing config cache, but still getting the same issue. Any ideas?

Answer 1

in windows :

thats worked for me without any require in webpack.mix

... just add a new variable in env file with this prefix : MIX_

MIX_API_URL=http://laravel:8000

but need to restart php artisan serve and also restart npm run watch....

  let api_url = process.env.MIX_API_URL;
  console.log("my env variable:");
  console.log(api_url);

in linux or docker:

i didnt use them yet