在src同级目录下新增.env.development和.env.production以及.env.test

在package.json中添加

"scripts": {
    "dev": "vite --mode development",
    "build": "run-p type-check \"build-only {@}\" --",
    "preview": "vite preview",
    "build-only": "vite build",
    "type-check": "vue-tsc --build",
    "build:prod": "vite build --mode production",
    "build:test": "vite build --mode test"
}

这里的文件名可以改短,.env.dev和.env.prod,只需要在package.json中修改配置即可

"scripts": {
    "dev": "vite --mode dev",
    "build": "run-p type-check \"build-only {@}\" --",
    "preview": "vite preview",
    "build-only": "vite build",
    "type-check": "vue-tsc --build",
    "build:prod": "vite build --mode prod",
    "build:test": "vite build --mode test"
}
# 开发环境配置 必须以VITE_开头
NODE_ENV = development
VITE_APP_TITLE = 管理系统
VITE_API_URL = /
VITE_SERVER_URL = http://localhost:8080/proj1

使用环境变量中内容

const appTitle = import.meta.env.VITE_APP_TITLE
console.log(appTitle)