Vue3——环境变量的配置

vue3环境变量的配置

• 开发环境（development）
• 测试环境（testing）
• 生产环境（production）
  项目根目录分别添加 开发、生产和测试环境的文件!

.env.development
.env.production
.env.test

文件内容

变量必须以 VITE_ 为前缀才能暴露给外部读取

NODE_ENV = 'development'
VITE_APP_TITLE = '开发Title'
VITE_APP_BASE_API = '/dev-api'

NODE_ENV = 'production'
VITE_APP_TITLE = '生产Title'
VITE_APP_BASE_API = '/prod-api'

NODE_ENV = 'test'
VITE_APP_TITLE = '测试Title'
VITE_APP_BASE_API = '/test-api'

配置运行命令：package.json

 "scripts": {
    "dev": "vite --open",
    "build:test": "vue-tsc && vite build --mode test",
    "build:pro": "vue-tsc && vite build --mode production",
    "preview": "vite preview"
  },

通过 import.meta.env 获取环境变量