在我们使用vue-cli创建的项目中,默认只有开发development和生产production两种环境变量;但在实际的项目开发过程中往往都会有测试环境,下面就来说一下如何适配测试环境test的环境变量。

1、在项目的config目录下新建test.env.js文件,然后拷贝prod.env.js文件内容到该文件,并修改production为test,代码如下:

2、在项目的build目录下新建webpack.test.conf.js文件,然后拷贝webpack.prod.conf.js文件内容到该文件,并修改引入对应的配置文件为test.env.js,代码如下:

3、在项目的build目录下新建build.test.js文件,然后拷贝build.js文件内容到该文件,并修改引入对应的配置文件为webpack.test.conf.js,代码如下:

4、在package.js文件中添加新的打包命令,代码如下:

5、最后根据不同的环境变量适配axios请求的baseURL,代码如下:

至此,我们在终端命令行分别执行npm run test和npm run build就分别打的测试环境和生产环境的包。

但有一点需要注意:

  在config目录下的index.js文件中,build模块下的属性配置是被test和production共享的,如下build模块:  

  如果要区分配置,可以拷贝整个build模块代码并修改build为test,然后将文件webpack.test.conf.js和build.test.js中“config.build.”的地方都修改为“config.test.”,具体如build.test.js文件中的下述代码:

应用七:Vue之适配test环境变量(2.0版)的更多相关文章

  1. 设置JDK环境变量(linux版)

     设置环境变量一.修改/etc/profile文件当本机仅仅作为开发使用时推荐使用这种方法,因为此种配置时所有用户的shell都有权使用这些环境变量,可能会给系统带来安全性问题.用文本编辑器打开/et ...

  2. Ubuntu 16.04安装JDK并配置环境变量-【小白版】

    系统版本:Ubuntu 16.04 JDK版本:jdk1.8.0_121 1.官网下载JDK文件jdk-8u121-linux-x64.tar.gz 我这里下的是最新版,其他版本也可以 2.创建一个目 ...

  3. classpath环境变量(JDK5.0之后不建议配置)

    classpath的作用: 作用是指定类搜索路径,要使用已经编写好的类,前提当然是能够找到它们了,一旦配置了classpath路径信息的时候,jvm与java编译器都会根据classpath指定的路径 ...

  4. 从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 二十一║Vue实战:开发环境搭建【详细版】

    缘起 哈喽大家好,兜兜转转终于来到了Vue实战环节,前边的 6 篇关于Vue基础文章我刚刚简单看了看,感觉写的还是不行呀,不是很系统,所以大家可能看上去比较累,还是得抽时间去润润色,修改修改语句和样式 ...

  5. vue-cli3.0 环境变量与模式

    vue-cli3.0移除了配置文件目录: config和build文件夹.可以说是非常的精简了,那移除了配置文件目录后如何自定义配置环境变量和模式呢? 为什么需要配置环境变量和模式呢? 所有方法肯定是 ...

  6. mac系统mysql配置环境变量(转)

    mac初次安装mysql,输入mysql -u root -p会出现:zsh: command not found: mysql的提示.此时需要配置环境变量. mac版mysql客户端:mysql-5 ...

  7. uboot环境变量初始化

    一.环境变量概述 1.环境变量的概念 可以理解为用户对软件的全局配置信息,这部分信息应该可以从永久性存储器上读取,能被查询,能被修改. 启动过程中,应该首先把环境变量读取到合适的内存区域,然后利用环境 ...

  8. JAVA虚拟机环境变量设置

    转自: 网络    下载java环境变量设置所需的jdk并安装,下载地址:http://www.oracle.com/technetwork/cn/java/javase/downloads/jdk7 ...

  9. Question20180106 Java环境变量的配置及为什么要配置环境变量

    Question 1  Java环境变量的配置及为什么要配置环境变量 Q1.1为什么要配置环境变量 在学习JAVA的过程中,涉及到多个环境变量(environment variable)的概念,如PA ...

随机推荐

  1. qbxt 考前集训 Day1

    立方数(cubic) Time Limit:1000ms   Memory Limit:128MB 题目描述 LYK定义了一个数叫“立方数”,若一个数可以被写作是一个正整数的3次方,则这个数就是立方数 ...

  2. Linux—Ubuntu14.0.5 修改gitlab管理员的密码

    1. 在root用户下,执行 gitlab-rails console production #进入gitlba控制台 2.获得用户数据,修改用户密码 [root@svr34 bin]# gitlab ...

  3. 继续聊WPF——Expander控件(2)

    <Window x:Class="Expander_Sample2.Window1" xmlns="http://schemas.microsoft.com/win ...

  4. 修改layui的后台模板的左侧导航栏可以伸缩

    原生的左侧导航栏代码: <div class="layui-side layui-bg-black"> <div class="layui-side-s ...

  5. Atcoder AGC031B Reversi (DP计数)

    简单的计数题.(总算做出一道AGC的B题了,然而这场比赛我忘记打了233333) 题目链接: https://atcoder.jp/contests/agc031/tasks/agc031_b 题意: ...

  6. 学习EXTJS6(7)基本功能-最常用的表单

    开发过程中关于表单的处理无非: 1.表单和表单元素 2.实现表单验证 3.表单的提交和加载 -------------------------------------- 1.Ext.form.Basi ...

  7. 炒了8年的概念,到底该如何理解DevOps这个词?

    什么是DevOps及误区 DevOps概念从2009年提出已有8个年头.可是在8年前的那个时候,为什么DevOps没有迅速走红呢?即便是在2006年Amazon发布了ECS,微软在2008年和2010 ...

  8. ACDream - Lowbit Sum

    先上题目: C - Lowbit Sum Time Limit: 2000/1000MS (Java/Others) Memory Limit: 128000/64000KB (Java/Others ...

  9. btrfs

    https://docs.docker.com/storage/storagedriver/btrfs-driver/ $ sudo cat /proc/filesystems | grep btrf ...

  10. android中常见的内存泄漏和解决的方法

    android中的内存溢出预计大多数人在写代码的时候都出现过,事实上突然认为工作一年和工作三年的差别是什么呢.事实上干的工作或许都一样,产品汪看到的结果也都一样,那差别就是速度和质量了. 写在前面的一 ...