Vue项目分环境打包的方法总结

这篇文章给大家介绍的内容是关于vue项目分环境打包的方法总结,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

我们开发项目的时候,用vue-cli 2.x版本新建的项目,只有dev, pro两种开发环境, 有时需要个test环境来给测试使用,所以找了很多方法,总结了个最简单的方法来给大家使用

1、package.json

在build下面添加一个test运行命令

1976123-b70d90d0cb23e90a.png

立即学习“前端免费学习笔记(深入)”;

2、prod.env.js

 在config -> prod.env.js 中修改代码

  'use strict'  // 读取系统运行时候的变量  const target = process.env.npm_lifecycle_event;  // 控制台日志输出  console.log('env is deploying, current env is', target)  // 判断环境变量,是test,还是build  if (target == 'test') {    var obj = {      NODE_ENV: '"production"',      API_ROOT: '"此处替换为测试环境地址"',    }  } else {    var obj = {      NODE_ENV: '"production"',      API_ROOT: '"此处替换为测试环境地址"',    }  }      module.exports = obj;

登录后复制

3、测试环境:

$ npm run test

登录后复制

正式环境: "$ npm run build"

登录后复制

相关文章推荐:

v-model实现原理是什么?v-model的使用方法介绍(附代码)

v-model实现原理是什么?v-model的使用方法介绍(附代码)

以上就是Vue项目分环境打包的方法总结的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2744698.html

(0)
上一篇 2025年3月8日 03:35:32
下一篇 2025年2月18日 07:46:26

AD推荐 黄金广告位招租... 更多推荐

相关推荐

发表回复

登录后才能评论