vue-cli3分环境打包项目

vue-cli3没有webpack配置文件,所以要区分线上和测试环境,要通过process.env.VUE_APP_TITLE来区分环境

具体为:

1、在项目根目录增加两个文件

内容为:

.env.prod:

1 NODE_ENV = 'production'
2 VUE_APP_TITLE = 'prod'
3 VUE_APP_DOMAIN = 'insapp.hsbxjj.com'// 可设置生产环境域名 使用时通过 process.env.VUE_APP_DOMAIN获取

.env.test:

1 NODE_ENV = 'production'
2 VUE_APP_TITLE = 'test'
3 VUE_APP_DOMAIN = 'insapptest.hsbxjj.com' //可设置测试环境域名 使用时通过 process.env.VUE_APP_DOMAIN获取

2、在配置文件package.json中配置script

"scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint",
    "test": "vue-cli-service build --mode test", //运行 npm run test 打测试环境的包
    "prod": "vue-cli-service build --mode prod"   //运行 npm run prod 打生产环境的包
  },

  

如果想增加其他需要区分环境的变量,在env.prod和.env.test增加即可,或者新建一个文件,做统一处理

let object={};
switch (process.env.NODE_ENV) {
    case 'development':
object.key=''; //根据业务增加,例如可以设置测试环境的埋点的key object.baseUrl
= "" //这里是本地的请求url break; case 'test': // 注意这里的名字要和步骤二中设置的环境名字对应起来
object.key=''; //根据业务增加,例如可以设置测试环境的埋点的key
        object.baseUrl = ""  //这里是测试环境中的url
        break;
    case 'production':
         object.key=''; //根据业务增加,例如可以设置生产环境的埋点的key
         baseUrl = "" //生产环境url
break ;
} export
default baseUrl;

 

posted @ 2019-10-12 14:15  Sonya·Lv  阅读(742)  评论(0编辑  收藏  举报