Vite: Environment variables from the environment are ignored

[Maronato]

Do NOT ignore this template or your issue will have a very high chance to be closed without comment.

Describe the bug

Only variables from .env files are loaded. Environment variables starting with VITE_, but defined outside .env files are not included in import.meta.env.

Reproduction

• Start vite within an environment containing variables starting with VITE_, using cross-env or other methods.
• These variables won't be available to the application, even though they are to the process

https://github.com/Maronato/vite-env-repro

System Info

• required vite version: v1.0.0-beta.12
• required Operating System: macOS 10.15.5
• required Node version: v12.17.0
• Optional:
  
  
  
  • yarn version: 1.22.4
  
  
  • Installed vue version: 3.0.0-beta.24
  
  
  • Installed @vue/compiler-sfc version: 3.0.0-beta.24
  
  

Logs (Optional if provided reproduction)

yarn run v1.22.4
warning package.json: No license field
warning ../package.json: No license field
$ cross-env VITE_CROSS_ENV=crossEnvVariable vite --debug
vite v1.0.0-beta.12
  vite:config env mode: development +0ms
[dotenv][DEBUG] did not match key and value when parsing line 2: 
  vite:config env: { VITE_DOT_ENV: 'dotEnvVariable' } +2ms
  vite:optimize Hash is consistent. Skipping. Use --force to override. +0ms
Port 3000 is in use, trying another one...
  vite:optimize Hash is consistent. Skipping. Use --force to override. +107ms

  Dev server running at:
  > Local:    http://localhost:3000/
  > Network:  http://192.168.0.66:3000/
  > Network:  ***:3000/

  vite:server server ready in 502ms. +0ms
  vite:hmr         / imports /src/main.js +0ms
  vite:rewrite (skipped) / +0ms
  vite:rewrite /src/main.js: rewriting +36ms
  vite:rewrite     "vue" --> "/@modules/vue.js" +2ms
  vite:hmr         /src/main.js imports /@modules/vue.js +38ms
  vite:rewrite     "./App.vue" --> "/src/App.vue" +1ms
  vite:hmr         /src/main.js imports /src/App.vue +1ms
  vite:rewrite     "./index.css" --> "/src/index.css?import" +1ms
  vite:hmr         /src/main.js imports /src/index.css +1ms
  vite:rewrite (skipped) /vite/hmr +62ms
  vite:resolve (optimized) vue.js -> node_modules/.vite_opt_cache/vue.js +0ms
  vite:rewrite /@modules/vue.js: no imports found. +9ms
  vite:sfc /Users/maronato/Documents/misc/temp/dotenv/src/App.vue parsed in 7ms. +0ms
  vite:rewrite /src/App.vue: rewriting +13ms
  vite:rewrite     "./components/HelloWorld.vue" --> "/src/components/HelloWorld.vue" +1ms
  vite:hmr         /src/App.vue imports /src/components/HelloWorld.vue +85ms
  vite:hmr ws client connected +4ms
  vite:sfc /Users/maronato/Documents/misc/temp/dotenv/src/App.vue parse cache hit +12ms
  vite:sfc /src/App.vue template compiled in 12ms. +12ms
  vite:rewrite (skipped) /src/App.vue?type=template +20ms
  vite:sfc /Users/maronato/Documents/misc/temp/dotenv/src/components/HelloWorld.vue parsed in 3ms. +7ms
  vite:rewrite /src/components/HelloWorld.vue: rewriting +6ms
  vite:rewrite     injecting import.meta.env for /src/components/HelloWorld.vue +0ms
  vite:rewrite /vite/env: no imports found. +70ms
  vite:sfc /Users/maronato/Documents/misc/temp/dotenv/src/components/HelloWorld.vue parse cache hit +71ms
  vite:sfc /src/components/HelloWorld.vue template compiled in 10ms. +10ms
  vite:rewrite (skipped) /src/components/HelloWorld.vue?type=template +12ms
  vite:rewrite (skipped) /src/index.css?import +5ms
  vite:rewrite (skipped) /src/assets/logo.png +18ms

[yyx990803]

That's intended. If you want to explicitly expose a actual env variable, you can expand it in .env:

VITE_EXPOSED=$SOME_VAR

[heywhy]

This issue has caused me some hours because I couldn't figure out why the deployed app is failing even when the env VITE_* is set. I think the project doc/readme could have made it more explicit. 😞