我想大家都是带着问题来的，和我一样，被这个多环境配置环境变量的问题搞懵了，在我研究了两天半（鸡）天后终于搞明白了，下面我就给大家分享一下，觉得不错的欢迎关注讨论~~~~

多环境配置

[ 首先我们看官方文档](环境变量和模式 | Vite 官方中文文档 (vitejs.cn)) vite默认是自带两个环境，development和production，也就是开发和生产环境，并且是有自带的一些环境变量的。

好了，话不多说，我就想给自己的项目配置三个环境，分别是development、test、production三个环境，而且每个环境都需要不同的环境变量。不要问为什么要配置不同的环境变量，不需要的话就不用配置呀。

我们首先在根目录（就是和index.html平级目录）创建三个文件，分别是

development环境：.env.development

test环境：.env.test

production环境：.env.production

vite的默认环境变量前缀是VITE_，每个文件都写上一些测试数据，环境变量就配置好了，接下来我们就要根据不同的命令访问不同的环境变量，话不多说上代码。

这样就配置好了，我们可以启动不同的命令测试一下，在main.js中访问不同环境定义的变量

VITE_MD在上面.env.production中定义的环境变量，我们就使用命令npm run build跑起来查看控制台，自己试一下就出来了。

我们可以在vite.config.js中获取的到环境变量，看代码

vite.config.js在node环境构建时，我们打印可以清楚的看到production的环境变量。

官方文档配置项踩坑点

大多数人在上一步已经解决完成多环境配置了，就算有疑问百度搜搜就看到了，解释很多，但是可能有小伙伴想和我一样，看官方文档想将[环境变量配置在一个文件夹中](共享配置 | Vite 官方中文文档 (vitejs.cn))，并且自己定义环境变量前缀，请看：

此时我们再启动生产命令npm run build,就会发现拿不到想要的环境变量

就开始吐槽鱿鱼细了，我看官方文档半天找到问题所在，因为现在.env文件都不在根目录了，而loadEnv(mode, process.cwd(), "IEVALUATING_") 代码中的 process.cwd()取到的是根路径，所以自然而然找不到。这时需要将路径改对，就可以找到配置的环境变量了。

到这一步就结束了，因为我讲的不够仔细，重点是解决大家的问题，因为应该会有人和我一样脑瘫哈哈，不看代码也找不来问题，[详细的讲解我给大家一个链接看一看基本都清楚了](vite中环境变量的使用与配置（非常详细） - 掘金 (juejin.cn))

谢谢大家观看，欢迎交流~~~~