在不同的文件里面配置不同的环境变量，可以让我们的配置更加容易维护和使用，这里我们说下vite配置环境变量和模式是怎么配置的。
Vite 在一个特殊的 import.meta.env 对象上暴露环境变量，官网上的东西咱这里就不抄了，O(∩_∩)O哈哈~
我们这里直接说怎么做的，毕竟官网上没有实际使用的例子，在下在实际使用的时候还遇到点问题，当然也可以说是自己没用对吧。
package.json里面的scripts修改，增加多个环境模式，如：
"scripts": {
"dev": "vite serve --mode development",
"test": "vite serve --mode test",
"ppe": "vite serve --mode ppe",
"prod": "vite serve --mode production",
"build:dev": "vue-tsc --noEmit && vite build --mode development",
"build:test": "vue-tsc --noEmit && vite build --mode test",
"build:ppe": "vue-tsc --noEmit && vite build --mode ppe",
"build:prod": "vue-tsc --noEmit && vite build --mode production",
"serve": "vite preview"
}在项目目录下增加环境变量的文件，如：
.env.development
# 开发环境变量
VITE_APP_TITLE=记账簿development
.env.test
# 质控环境变量
VITE_APP_TITLE=记账簿test.env.ppe
# 灰度环境变量
VITE_APP_TITLE=记账簿ppe.env.production
# 生产环境变量
VITE_APP_TITLE=记账簿在vue里面使用，比如：
console.log('VITE_APP_TITLE:' + import.meta.env.VITE_APP_TITLE);这里面有个问题需要注意，就是字符串里面不能直接用import.meta.env.的方式使用，不然打包的时候会报错，可以用’import.meta\u200b.env.VITE_APP_TITLE’的方式使用，这个其实在官网上有说到，不过没怎么用到的话时间一长就容易忘了，贴下报错信息，方便后面复查：
D:\study\gitee\study\vite2vue3study>npm run build:prod
> vite2vue3study@0.0.0 build:prod D:\study\gitee\study\vite2vue3study
> vue-tsc --noEmit && vite build --mode production
vite v2.5.5 building for production...
? 16 modules transformed.
[rollup-plugin-dynamic-import-variables] Unexpected token (12:18)
file: D:/study/gitee/study/vite2vue3study/src/views/About.vue?vue&type=script&lang.ts:12:18
error during build:
SyntaxError: Unexpected token (12:18)
at Parser.pp$4.raise (D:\study\gitee\study\vite2vue3study\node_modules\rollup\dist\shared\rollup.js:16958:13)
at Parser.pp.unexpected (D:\study\gitee\study\vite2vue3study\node_modules\rollup\dist\shared\rollup.js:14466:8)
at Parser.pp.expect (D:\study\gitee\study\vite2vue3study\node_modules\rollup\dist\shared\rollup.js:14460:26)
at Parser.pp$3.parseExprList (D:\study\gitee\study\vite2vue3study\node_modules\rollup\dist\shared\rollup.js:16827:12)
at Parser.pp$3.parseSubscript (D:\study\gitee\study\vite2vue3study\node_modules\rollup\dist\shared\rollup.js:16192:25)
at Parser.pp$3.parseSubscripts (D:\study\gitee\study\vite2vue3study\node_modules\rollup\dist\shared\rollup.js:16149:24)
at Parser.pp$3.parseExprSubscripts (D:\study\gitee\study\vite2vue3study\node_modules\rollup\dist\shared\rollup.js:16133:21)
at Parser.pp$3.parseMaybeUnary (D:\study\gitee\study\vite2vue3study\node_modules\rollup\dist\shared\rollup.js:16096:17)
at Parser.pp$3.parseExprOps (D:\study\gitee\study\vite2vue3study\node_modules\rollup\dist\shared\rollup.js:16029:19)
at Parser.pp$3.parseMaybeConditional (D:\study\gitee\study\vite2vue3study\node_modules\rollup\dist\shared\rollup.js:16012:19)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! vite2vue3study@0.0.0 build:prod: `vue-tsc --noEmit && vite build --mode production`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the vite2vue3study@0.0.0 build:prod script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Administrator\AppData\Roaming\npm-cache\_logs\2021-09-17T08_00_39_340Z-debug.log
