vue3的环境切换配置

在不同环境的变量可以定义在.env.[mode]文件中,如.env.dev, .env.prod等,如果.env文件和.env.[mode]中有相同的key,后者的定义会覆盖前者

例:以下有是哪个环境编写的demo,分别是:

• 开发环境,mode为dev ,文件名为.env.dev

VITE_BASE_API=/dev-api
VITE_BASE_URL=http://localhost:6666/dev/

• 测试环境,mode为uat ,文件名为.env.uat

VITE_BASE_API=/prod-api
VITE_BASE_URL=http://localhost:8888/prod-api/

• 正式环境,mode为prod,文件名为.env.prod

VITE_BASE_API=/uat-api
VITE_BASE_URL =http://localhost:7777/uat/

 

在package.json文件中添加启动的配置

"scripts": {
    "dev": "vite --mode dev",
    "prod": "vite --mode prod",
    "test": "vite --mode uat",
    "build": "vite build",
    "preview": "vite preview"
  },