ajax生产环境和开发环境,vuecli3.0进行生产环境、测试环境和开发环境配置

一、上图的三个文件须要本身加在所建立的vuecli项目的根目录vue

二、3个文件具体的配置ajax

developmentnpm

productionelement-ui

testjson

NODE_ENV = 'development' //模式

VUE_APP_MODE = 'development' //经过"VUE_APP_MODE"变量来区分环境

outputDir = 'development'

VUE_APP_URL = "http://ip:端口号/QHSE/"

三、在package.json进行配置服务器

要是执行npm build build-test报错，就执行npm run build-test,此时是进行编译 async

四、在vue.config.js中根据本身项目的须要进行配置ui

1) this

 2)url

五、设置请求的地址根据所在环境去请求对应的后台接口

import { Progress } from "element-ui";

// console.log(process.env.)

var obj = {

// 10.2.112.32 http://localhost:9999/QHSE/

// BASE_URL: "http://10.39.65.52:8080/QHSE/", //服务器

// BASE_URL: "http://10.2.114.160:8080/QHSE/", //子鑫

BASE_URL: process.env.VUE_APP_URL,

// BASE_URL: "http://localhost:9999/QHSE/", //本地

getConn(param, data) {

return new Promise((resolve, reject) => {

$.ajax({

type: "POST",

async:false, //缘由

url: this.BASE_URL + param,

// 解决ajax连接数据没法带token的问题

xhrFields: {

withCredentials: true

},

data: data,

success(data) {

resolve(JSON.parse(data))

},

error(info) {

reject(info)

}

});

})

}

}

export default obj

使用：

let requestObj = require("@/assets/request/request.js"); //引入

//调用

requestObj.default

.getConn("hazardInfoController/getHazardByFindTime", {})

.then(res => {

if (res.msg == "查询成功！" && res.data != null) {

// _this.hdanger = res.data;

_this.hdanger = res.data;

}

});