vue根据不同的环境使用不同的接口地址

package.json文件,添加。

    "dev:test": "vue-cli-service serve --mode test",
    "build:test": "vue-cli-service build --mode test",
    "build:prod": "vue-cli-service build --mode prod",

代表npm命令行新增了几条命令,这里的test和prod是自己命名的你也可以写别的。只要下面获取的时候根据这些名字匹配使用本地测试还是线上环境就行。

mpm run dev:test 运行本地环境

mpm run build:test 用测试接口打包

mpm run build:prod 用线上接口打包

然后我们可以根据process.env.NODE_ENV这个变量获取到输入的命令行的:后面的内容

我们新建一个config.js的文件存储接口地址和appid等全局需要使用的一些变量。

let HOST = process.env.NODE_ENV|| 'prod';
let baseURL = "";
let appid = "";
if(HOST === 'prod'){  //正式服
  baseURL = "https://api.heebu.cn";
  appid = 'wx90ad292c1eb1105c';
}else if(HOST === 'test'){ // 测试
  baseURL = "https://testapi.heebu.cn";
  appid = 'wx9b070f1675720f2b';
}else{ // 本地
  baseURL = HOST;
  appid = 'wx9b070f1675720f2b';
}

export {

  baseURL,

  appid

}

其他页面可以引用这个config.js

import { baseURL,appid} from 'config.js'

然后就可以使用这个baseURL啦。

 

Guess you like

Origin blog.csdn.net/qq_33769914/article/details/121518416