vue 添加多个模式

vue 添加多个模式

1. 需求描述

项目使用vue。
就在北京时间20210108，甲方爸爸提出一些新的需求，正式环境需修改，但我们的测试环境目前不需要修改。

2. 实现思路

vue分本地开发模式development和线上部署production模式，想着能否再增加一个模式来区分production与official。

3. 具体实现

• 3.1 查阅vue文档

  经查阅vue文档确有提及 链接

• 3.2 在vue项目 package.json同级目录下，创建.env.official文件
  .env.official文件代码如下：

NODE_ENV = 'official'
VUE_APP_TITLE = 'official'

• 3.3 配置package.json打包命令

  如下所示：
  npm run dev对应process.env.NODE_ENV为development模式
  npm run build 对应process.env.NODE_ENV为production模式
  npm run build:official 对应process.env.NODE_ENV为official模式
  代码中可以通过process.env.NODE_ENV来判断当前所处哪个环境，对响应的代码做出调整，以便每次上线进行不必要的修改。

 "build": "vue-cli-service build",
 "build:official": "vue-cli-service build --mode official",

注意： 若vue配置文件中使用过process.env.NODE_ENV，还需查看是否需要修改。