vue环境配置 生产 开发 测试,vue生产环境和开发环境是什么
本文主要介绍了Vue项目的开发、测试和正式环境流程，具有很好的参考价值。希望对大家有帮助。如有错误或不足之处，请不吝赐教。
目录
方法1和方法2 1。在构建文件夹2中创建test.js文件。修改config文件夹3中的prod.env.js文件。在package.json文件4中添加npm run test命令。判断项目代码中的环境。
方法一
最简单的方法：通过判断位置来判断环境. href
函数env() {
if(process . ENV . node _ ENV=== development )返回 development ；//开发环境
if(window . location . href . includes( 192.168 ))返回 test ；//测试环境， 192.168 看实际情况
返回“生产”//在线环境
}
方法二
适用于vuecli 2.x构建的项目。
只有两个命令，npm run dev和npm run build，开发编译Vue Cli 2.x构建的项目添加测试环境，我们可以扩展一个npm run test的命令，输出测试环境中执行的代码。
1.在build文件夹中创建test.js文件
test.js中的代码非常简单，只有两行。主要是配置一个环境变量来区分测试和正式环境。这里没有直接修改原来的process.env.NODE_ENV怕影响原来的逻辑。
注意：类型的值必须嵌套在单引号和双引号中，并且不能直接为“test ”,否则将会报告错误。具体代码如下：
//配置要测试的环境变量类型
process.env.type=测试
//引入build.js文件，执行原编译代码。
要求(。/build’)
2.修改config文件夹中的prod.env.js文件
配置完成后，可以在项目代码中调用process.env.type。代码如下：
模块.导出={
NODE_ENV:“生产”，
//将上面设置的环境变量赋给type属性。
类型：process.env.type
}
3.在package.json文件中添加npm run test命令
添加一个命令来执行我们在上面创建的test.js文件。
脚本:{
dev :节点build/dev-server.js ，
test :节点build/test.js ，
build :节点build/build.js
},
4.在项目代码中判断环境
按照以上步骤操作后，就可以在项目代码中编写判断了。
let baseURL
//开发环境
if(process . ENV . node _ ENV=== development ){
baseURL= http://192 . 168 . 1 . 110:8080/
//编译环境
}否则{
//测试环境
if (process.env.type===test) {
baseURL=http://test.xxx.com/
//正式环境
}否则{
baseURL=http://app.xxx.com/
}
}
以上个人经历，希望能给大家一个参考，也希望大家多多支持我们。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。