.env files are not loaded

[meoyawn]

Describe the bug

There's an envDir section in Vite docs https://vitejs.dev/config/#envdir saying that .env files are loaded from root dir by default.

But neither .env nor .env.test file is loaded in vitest 0.9.3

Reproduction

https://github.com/meoyawn/vitest-env

System Info

System:
  OS: macOS 11.6.2
  CPU: (8) x64 Intel(R) Core(TM) i7-4770HQ CPU @ 2.20GHz
  Memory: 2.65 GB / 16.00 GB
  Shell: 5.8 - /bin/zsh
Binaries:
  Node: 17.9.0 - /usr/local/bin/node
  Yarn: 1.22.18 - /usr/local/bin/yarn
  npm: 8.5.5 - /usr/local/bin/npm
Browsers:
  Brave Browser: 98.1.35.101
  Chrome: 100.0.4896.88
  Firefox: 92.0
  Safari: 15.2
npmPackages:
  vitest: ^0.9.3 => 0.9.3

Used Package Manager

yarn

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[kpturner]

I have just this minute hit the exact same issue. I have a Vue 3 application built with Vite and tested with Vitest. I created a .env file to move some of the variables into environment variables. So, using an example in the docs, I change my root vue component to get its title from import.meta.env.VITE_APP_TITLE and it works fine. However, when the tests run, this is completely blank/undefined. Is there something special I need to do with the vitest config? This seems to defeat the premise that vitest will use the same config as vite.

#1149

[sheremet-va]

@meoyawn reproduction works, if I add VITE_ prefix. This is Vite limitation.

[sheremet-va]

@kpturner can you give me a reproduction, when it works with Vite, but doesn't work in Vitest?

[meoyawn]

@sheremet-va do I understand correctly that FOO=BAR from .env file is not loaded by design?

[meoyawn]

tried setting envPrefix to "", got:

Error: envPrefix option contains value '', which could lead unexpected exposure of sensitive information.

Really hoped I could use vitest to test my node backend 😞

[sheremet-va]

@sheremet-va do I understand correctly that FOO=BAR from .env file is not loaded by design?

Yes, Vite exposes only env variables starting with VITE_. Vite also exposes loadEnv function that returns a env object (that you can assign to process.env like Object.assign(procces.env, loadEnv(mode, './', ''))), you can use it and pass an empty prefix.

[meoyawn]

@sheremet-va it works! Thank you so much

[kpturner]

Not sure why this was closed when I have been asked to provide a repo where it doesn't work in vitest even with environment variables with. "VITE_" prefix? Do you now not want a repo showing this?

[kpturner]

@kpturner can you give me a reproduction, when it works with Vite, but doesn't work in Vitest?

@sheremet-va This is the repro repo: https://github.com/kpturner/vitest-github-repro
Do you want me to raise a different ticket? It is already in a discussion here: #1149

[sheremet-va]

@kpturner can you give me a reproduction, when it works with Vite, but doesn't work in Vitest?

@sheremet-va This is the repro repo: https://github.com/kpturner/vitest-github-repro Do you want me to raise a different ticket? It is already in a discussion here: #1149

Hey, your issue is with this code:

    define: { 'process.env': {} },

This overrides process.env with an empty object while running in Vitest (runs inside Node). Remove this line (maybe use condition, like mode === 'test' or process.env.VITEST) and everything will work.

I will make a patch that removes it inside a Vitest plugin in the future to not case confusion.

[kpturner]

Excellent - thanks

[meoyawn]

@kpturner sorry closing the issue prematurely was my mistake

[repetitioestmaterstudiorum]

If I understand the problem correctly, then vitest already has a solution for this: https://vitest.dev/config/#setupfiles

I simply had to add the line setupFiles: 'dotenv/config', to my vitest.config.ts file (as I already had dotenv installed as dev dependency), and that took care of loading my .env file.

Example repo: https://github.com/repetitioestmaterstudiorum/ts-boiler/blob/master/vitest.config.ts

[DoisKoh]

Vite has a specific way of loading the .env files (.env.development based on NODE_ENV=development for example). I believe Vitest should do the same (or at least provide the option)?

[sheremet-va]

Vite has a specific way of loading the .env files (.env.development based on NODE_ENV=development for example). I believe Vitest should do the same (or at least provide the option)?

Vite doesn't populate process.env, because there is no process in browser context. Vitest on the other hand does it. Vite loads .env.<mode>, Vitest also does this. So I am not sure what you are asking for. Beware that Vitest only loads env starting with VITE_. This is Vite's limitation.