0

I have a Vue project built with Vite, and I need to have at least 3 different environment files.

I have:

  • .env.local
  • .env.development
  • .env.production

As far as I know, when running npm run build (alias for vite build in my project) the build process should pick up the .env.production shouldn't it?. However I'm noticing that it always picks up the .env.local file.

I came across this answer explaining the priorities of the environment files, but does it mean that if there's an .env.local file in the project it will always pick that one unless explicitly stating the mode? (e.g: vite build --mode production)? Or am I doing something incorrectly? Is there a way to make sure running vite build picks up the production file?

IvanS95
  • 5,364
  • 4
  • 24
  • 62

1 Answers1

0

The vite docs explain the same priority based loading.

.env                # loaded in all cases
.env.local          # loaded in all cases, ignored by git
.env.[mode]         # only loaded in specified mode
.env.[mode].local   # only loaded in specified mode, ignored by git

An env file for a specific mode (e.g. .env.production) will take higher priority than a generic one (e.g. .env).

build command runs in production mode by default.

If you want to override .env.local you can put variables in .env.production.local which should take priority.

.env.production can't override .env.local but .env.development.local sounds more appropriate for local variables if they're not meant for production.

yoduh
  • 7,074
  • 2
  • 11
  • 21