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

  1. package.json

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

     "test": "node build/build.js"

  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
```

Vue 项目分环境打包的更多相关文章

  1. Vue项目分环境打包的实现步骤

    转:https://blog.csdn.net/xinzi11243094/article/details/80521878 方法一:亲测真的有效 在项目开发中,我们的项目一般分为开发版.测试版.Pr ...

  2. VUE 如何分环境打包(开发/测试/生产)配置

    前言 之前小玲一直处于更新,迭代项目的状态,开发环境.测试环境.生产环境都是前辈配置好的,自己几乎没有配置过,这次做几个新项目时,面临着上线,需要分环境打包配置,于是在网上遨游了一会会,摸索着按照网上 ...

  3. vue实现分环境打包步骤(给不同的环境配置相对应的打包命令)

    在新建好的项目中,一般执行npm run build就是打包了,但此时只能打包到一个环境,不同环境需要配置不同的地址,可以手动更改接口的地址,也可以自行配置命令而不需要每次打包进行地址切换,步骤如下: ...

  4. # # # Vue的分环境打包

    我们使用Vue-cli的默认环境是只有dev和prod两种环境,在开发中我们的项目一般是开发版.测试版.pre版.Prod版.我们一般是在源码中API地址中修改后然后打包. ###1.首先安装cros ...

  5. 基于Vue + webpack + Vue-cli 实现分环境打包项目

    需求由来:我公司项目上线发布至服务器分为三个环境分别为测试环境.预发布环境.生产环境:前期做法是项目通过脚步打包时由脚步把域名和后缀名之类的全部替换成要发布的环境所需要的,因为我公司的项目比较大由许许 ...

  6. 前端自动分环境打包(vue和ant design)

    现实中的问题:有时候版本上线的时候,打包时忘记切换环境,将测试包推上正式服务器,那你就会被批了. 期望:在写打包的命令行的时候就觉得自己在打包正式版本,避免推包时候的,不确信自己的包是否正确. 既然有 ...

  7. vue分环境打包配置不同命令

    1.安装cross-env (cross-env能跨平台地设置及使用环境变量)cnpm/npm  i  cross-env -D 2.新建模板 红色的为相关文件 3.配置各个文件 (1)config下 ...

  8. vue3.0+vite+ts项目搭建-分环境打包(四)

    分环境打包配置 新建.env.dev(或者.env) VITE_NODE_ENV = 'dev' VITE_HOST = 'http://local.host.com' 执行yarn dev ,控制台 ...

  9. 使用Maven分环境打包:dev sit uat prod

    使用Maven管理的项目,经常需要根据不同的环境打不同的包,因为环境不同,所需要的配置文件不同,比如database的连接信息,相关属性等等. 在Maven中,我们可以通过P参数和profiles元素 ...

随机推荐

  1. SLAM——视觉里程计(一)feature

    从现在开始下面两篇文章来介绍SLAM中的视觉里程计(Visual Odometry).这个是我们正式进入SLAM工程的第一步,而之前介绍的更多的是一些基础理论.视觉里程计完成的事情是视觉里程计VO的目 ...

  2. Python - 使用 PostgreSQL 数据库

    基本用法 # -*- coding: utf-8 -*- # !/usr/bin/python # 需要安装下面的驱动包 import psycopg2 # 连接到一个现有的数据库,如果数据库不存在, ...

  3. 吴裕雄--天生自然C语言开发:结构体

    struct tag { member-list member-list member-list ... } variable-list ; struct Books { ]; ]; ]; int b ...

  4. 腾讯云 Serverless 首发 1ms 计费粒度,立省 70% 费用

    云函数 SCF 采用按需付费的方式,并首次发布 1ms 计费粒度,真正实现按使用多少计算能力来计费. 云函数(Serverless Cloud Function,SCF)是腾讯云为企业和开发者们提供的 ...

  5. 吴裕雄--天生自然python学习笔记:python实现自动网页测试

    Python 可实现的网页测试的功能十分强大,甚至能通 过编程来实现让绝大多数的测试过程自动化. 这对很多开 发者来说,绝对是不可多得的神器. hash lib 纽件可以判别文件是否有过更改,只需要用 ...

  6. [LC] 66. Plus One

    Given a non-empty array of digits representing a non-negative integer, plus one to the integer. The ...

  7. 吴裕雄--天生自然python学习笔记:Python3 日期和时间

    Python 程序能用很多方式处理日期和时间,转换日期格式是一个常见的功能. Python 提供了一个 time 和 calendar 模块可以用于格式化日期和时间. 时间间隔是以秒为单位的浮点小数. ...

  8. Alfresco的安装配置(Centos6系统中安装)

    Alfresco是一款开源的企业内容管理系统(ECMS),为企业提供了日常的文档管理.协同工作.工作记录管理.知识管理.网络内容管理.图片管理等多种功能. Alfresco是目前应用最广泛的开源企业知 ...

  9. sql语句查询成绩表各科前三名

    --语法形式: ROW_NUMBER() OVER(PARTITION BY COL1 ORDER BY COL2) --解释: 根据COL1分组,在分组内部根据 COL2排序,而此函数计算的值就表示 ...

  10. python3多进程爬虫(第二卷)

    上卷中讲到,我有4个进程,可是我要同时爬取20+数据怎么办,很明显上卷的语法公式不可以,所以现在我引入线程池 现在看一下线程池的语法 看一下爬虫: 注意圈中重点