vue-cli 4.x + axios跨域解决方案

前后端分离的项目中，前端为了提高开发效率往往会自己开一个小型的服务器，比如 webpack.devServer ，这样在前端调用后端接口的时候必然会面对跨域问题。

之前在做 vue+node.js 前后端分离项目的时候，遇到 axios 不支持跨域的问题，网上找了很多资料，但很少有讲 vue-cli4.x 版本的，当时看的是这位大佬的博文 指路：Vue-cli 3.x + axios 跨域方案踩坑指北 讲得很详细，我这里只做个人记录总结。

解决方法：使用 **webpack 的 devServer 的代理功能（proxy）**来实现开发环境中的跨域。

在 vue.config.js 文件中配置 devServer.proxy
PS：vue-cli4.x 中默认是没有这个文件的，可以在项目的根目录新建一个，并命名为 vue.config.js

module.exports = {
  configureWebpack: {
    devServer: {
      proxy: {
        //名字可以自定义，用于指定哪些请求需要被 target 对应的主机代理
        // 当前 devServer 的地址是 localhost:8080 , 需要代理的地址是 localhost:3000
        '/api': {
          target: 'http://localhost:3000', //设置你调用的接口域名和端口号 别忘了加http
          changeOrigin: true, //这里设置是否跨域
          pa