vue-Cli3.0使用全局变量进行接口及域名管理

思路很简单：

        第一步：创建.env文件，本地环境，测试环境，线上环境，系统默认为三个，根据需求可进行添加。

        注意点：在env文件里命名必须以  VUE_APP_开头，比如说url：VUE_APP_BASE_URL = "路径"。

        第二步：创建vue.config文件（vue-cli3.0默认没有此文件，需自行创建，配置方式和2.0一样）,然后在proxy里进行变量引用。

 

        第三步：创建axios文件，主要是指定baseURL,事实上这步也是最重要的一步，指定了baseURL,在不同环境下都是不同的URL。

import axios from "axios";
const instance = axios.create({
  baseURL: process.env.VUE_APP_BASEAPI
});
export default instance;

       第四步：模块化接口,每个功能模块的接口在一个文件里，方便管理。也利于多人开发。

import axios from "../http"; //http中创建的axios实例
import qs from "qs"; //qs模块
const https = {
  //登陆接口
  login(params) {
    return axios.post(`您的URL`, qs.stringify(params));
  },
  //注册用户获取手机验证码
  getRegisterCode(params) {
    return axios.post(`您的URL`, params);
  },
  //注册用户名接口
  doRegister(params) {
    return axios.post(`您的URL`, qs.stringify(params));
  },
  //修改密码接口
  updatePassword(params) {
    return axios.post(`您的URL`, params);
  }
};
export default https;

至此，关于VUE项目中的axios管理和域名的管理就结束了！