vue-cli3项目配置(跨域)

2021-02-18  本文已影响0人  李俊佚

vue.config.js 是一个可选的配置文件,项目初始化时,可能会需要自行创建vue.config.js文件来对项目进行控制。

详情参考vue-cli官网
https://cli.vuejs.org/zh/config/#vue-config-js

当前项目中,常用配置如下

module.exports = {
  outputDir: 'dist', //build输出目录
  assetsDir: 'assets', //静态资源目录(js, css, img)
  lintOnSave: false, //是否开启eslint
  publicPath: "./",
  devServer: {
    open: true, //是否自动弹出浏览器页面
    // host: "localhost",
    port: '8081',
    https: false,
    hotOnly: false,
    proxy: {//跨域配置
     '/api/v1/client': {
        target: "http://192.168.1.133:7100", //API服务器的地址
        changeOrigin: true, // 虚拟的站点需要更管origin
      }, 
      '/api': {
        target: "http://192.104.1.13", //API服务器的地址
        changeOrigin: true, // 虚拟的站点需要更管origin
        // ws: true,  //代理websockets
        // pathRewrite: {   //重写路径 比如'/api/aaa/ccc'重写为'/aaa/ccc'
        //     '^/api/v1/stock-auth': '',
        // }
      },
      
    },
  }
}

devServer.proxy对象可通过添加多个key来进行精准配置。

注意,解析过程从上往下进行,如果请求的API在前方找到后,将不会再往下寻找。如: 如果顺序为'/api','/api/v1/client',则只要带有/api前缀的请求,都会被'/api'代理,'/api/v1/client'配置无法生效。
上一篇下一篇

猜你喜欢

热点阅读