前端开发如何区分正式环境与测试环境

214 阅读1分钟

前提:使用的打包工具是vite

  1. 在vue项目的一级目录下,新建立这两个文件:

image.png

.env.development是开发环境的配置文件

.env.production是生产环境的配置文件【就是正式环境】

2.在配置文件分别写入配置代码:

image.png

image.png

举个栗子

eg:当我们想要区分开发环境的打包命令 与 生产环境的打包命令时,只需要按照下列步骤去做:

image.png

  • 如果遇到项目打印‘import.mata.env’,没有正确打印出我们需要的数据,则要去vite.config.js文件中看看,看看envPrefix属性对应的值是什么? 如果envPrefix:'VITE_',那么在.env.development文件里、在.env.peoduction文件里写配置项的时候,都要以VITE_开头。

原因如下:

image.png

具体做法如下:

image.png

image.png