vue项目代理配置

根目录新建vue.config.js文件 添加如下内容

//绝对路径配置
const path = require('path');//引入path模块
function resolve(dir){
    return path.join(__dirname,dir)//path.join(__dirname)设置绝对路径
}
module.exports = {
	//代理
	devServer: {
      open: true,
      proxy: {
        '/api': {
          target: 'http://192.168.1.235:8787',
          changeOrigin: true,
          pathRewrite: {
            '^/api': ''
          }
        }
      }
  },
  //配置绝对路径
  chainWebpack:(config)=>{
    config.resolve.alias
    //set第一个参数：设置的别名，第二个参数：设置的路径
    .set('@',resolve('./src'))
    .set('@components',resolve('./src/components'))
  }
}

vue项目request封装

src下新建utils文件夹/request.js文件 添加如下内容

import axios from 'axios'//npm install axios --save
import NProgress from 'nprogress'//npm install --save nprogress
import 'nprogress/nprogress.css'

const request = axios.create({
  timeout: 20000,
})
//请求拦截器
request.interceptors.request.use(config => {
  //store.getters.token && config.headers['token'] = getToken()//token
  NProgress.start()
  return config
})
//响应拦截器
request.interceptors.response.use(response => {
  NProgress.done()
  return Promise.resolve(response.data)
}, error => {
  NProgress.done()
  return new Promise(() => { })
})
export default request