Vite多环境配置及变量识别规则

.env                # 所有情况下都会加载
.env.local          # 所有情况下都会加载，但会被 git 忽略
.env.[mode]         # 只在指定模式下加载
.env.[mode].local   # 只在指定模式下加载，但会被 git 忽略

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import vueJsx from '@vitejs/plugin-vue-jsx'
// https://vitejs.dev/config/
export default defineConfig({
  envDir: "./viteEnv",//这里使用相对路径，绝对路径其实也可以
  server:{
    port: 3001,
    strictPort: true
  },
  plugins: [vue(), vueJsx()]
})

viteEnv/
    |--.env.local
    |--.env.develop
    |--.env.develop.local
    |--.env.production
    |--.env.production.local

# .env.local
# 所有模式下都会加载，但是会被git忽略
VITE_APP_NAME= venus
# .env.develop 测试环境参数值
VITE_OWNER=developer
VITE_POSITION=shanghai
VENUS_CONNECTION_TIMEOUT = 30000
# .env.develop.local 仅在develop模式下加载，但是会被git忽略,相同变量名时，此文件中的优先
VENUS_CONNECTION_TIMEOUT = 10000
# env.production 生产环境参数值
VITE_OWNER=production
VITE_POSITION=china
VENUS_CONNECTION_TIMEOUT = 3600

  "scripts": {
    "start": "vite --mode develop",
    "start:prod": "vite --mode production",
    "build": "vue-tsc --noEmit && vite build --mode develop",
    "build:prod": "vue-tsc --noEmit && vite build --mode production",
    "preview": "vite preview"
  }

# main.ts是我这个项目的入口文件，相关代码会在客户端执行，在这里打印一下变量
console.log(import.meta.env)

export default defineConfig({
  envDir: "./viteEnv",
  envPrefix: ["VITE", "VENUS"], //这个时候，我们可以将VITE_、VENUS_开头的变量统统透传给客户端
  server:{
    port: 3001,
    strictPort: true
  },
  plugins: [vue(), vueJsx()]
})

import { defineConfig,loadEnv } from 'vite'
import vue from '@vitejs/plugin-vue'
import vueJsx from '@vitejs/plugin-vue-jsx'
//在服务端获取配置参数
const console = require("console")
console.log(loadEnv('develop', './viteEnv'))
// https://vitejs.dev/config/
export default defineConfig({
  envDir: "./viteEnv",
  envPrefix: ["VITE", "VENUS"],
  server:{
    port: 3001,
    strictPort: true
  },
  plugins: [vue(), vueJsx()]
})

loadEnv('develop', './viteEnv', ["VITE", "VENUS"])

NODE_ENV=production

{
  "VITE_USER_NODE_ENV": "production",
  "VITE_OWNER": "developer",
  "VITE_POSITION": "shanghai",
  "VITE_APP_NAME": "venus",
  "VENUS_CONNECTION_TIMEOUT": "600",
  "BASE_URL": "/",
  "MODE": "develop",
  "DEV": false,
  "PROD": true, //已经变为生产环境
  "SSR": false
}

const process = require("process")
console.log(process.env)