vue - vue.config.js中devServer配置

た入场券 2021-09-29 03:48 489阅读 0赞

### 前言 ###

这里写你调用接口的基础路径，来解决跨域，如果设置了代理，那你本地开发环境的axios的`baseUrl`要写为`''`，即空字符串

### 只有一个接口ip端口时 ###

devServer: {
        open: false,
        // 跨域
        proxy: {
          '/nuojinadm/': {
            target: 'http://192.168.0.11/',
            changeOrigin: true
          }
        }
      }

2、设置axios中的baseUrl 与proxy端口一致

baseUrl: {
        dev: '/nuojinadm/',
        pro: '/nuojinadm/'
     }

### 当有多个ip端口的接口时 ###

devServer: {
        open: false,
        port: 8801, // 自定义修改8080端口
        // 代理跨域
        proxy: {
          '/proxy1/adm/': {
            target: 'http://192.168.0.xx:xxxx/',
            changeOrigin: true
          },
          '/proxy2/adm/': {
            target: 'http://192.168.0.xx:xxxx/',
            changeOrigin: true
          },
          '/httpsProxy3/config/': {
            target: 'https://xx.xx.com',
            secure: false, // https协议才设置
            changeOrigin: true
          }
        }
      }

2、设置axios中的baseUrl 设置为空

baseUrl: {
        dev: '/',
        pro: '/'
      }

3、在每个request（axios）页面中

const proxyxxx= '/xxx/xxx'
    
    export const getBannerList = params => {
      return axios.request({
        url: `${proxyxxx}/banner/v1/banner/${params.pageSize}/${params.pageNum}`,
        params,
        method: 'get'
      })
    }

发表评论取消回复

表情：

评论列表（有 0 条评论，489人围观）

还没有评论，来说两句吧...

相关阅读

相关 webpack 配置devServer 服务器

webpack 配置devServer 服务器 / loader: 1. 下载 2. 使用（配置） plugins：1. 下载 2. 引入

迷南。/ 2023年01月09日 12:35/ 0 赞/ 145 阅读

相关 webpack配置devServer配置https代理与证书

浏览器如果需要开发某些特定功能，需要`https`浏览器才会给予功能权限，则开发时我们需要在https环境下面是配置一个`webpack` `devServer`的`h

╰+攻爆jí腚メ/ 2023年01月07日 12:27/ 0 赞/ 135 阅读

相关 Vue devServer.proxy代理配置详解

const proxy = require('http-proxy-middleware'); module.exports = {

￡神魔★判官ぃ/ 2022年12月17日 01:24/ 0 赞/ 259 阅读

相关 sass在vue中配置

1.创建variable.scss 文件 // 颜色 $color-red:red; $color-yellow: yellow; $color-white: whit

骑猪看日落/ 2022年11月06日 05:55/ 0 赞/ 160 阅读

相关 vue-cli中配置sass

如何配置sass 一、安装对应依赖node模块： npm install node-sass --save-dev npm install sass-loa

女爷i/ 2022年05月20日 09:23/ 0 赞/ 213 阅读

相关 vue中rem如何配置

vue中rem的配置开发移动端，我们常常会因为把握不好尺度而觉得十分难受，因此可以用到rem+flex进行，那么vue中我们该如何如何配置呢？ 1. 在js中统

末蓝、/ 2022年04月02日 15:54/ 0 赞/ 269 阅读

相关 devServer之proxy跨域

配置 devServer:{ contentBase:'./', proxy:{

矫情吗；*/ 2022年01月22日 04:03/ 0 赞/ 190 阅读

相关 webpack实例解析三（devServer）

webpack的devServer，给我们提供了一个本地的node服务器，用于开发模式下调试我们的应用. webpack-dev-server模块启动之后把我们的代码打包到n

港控/mmm°/ 2021年10月01日 01:12/ 0 赞/ 380 阅读

相关 vue - vue.config.js中devServer配置

前言这里写你调用接口的基础路径，来解决跨域，如果设置了代理，那你本地开发环境的axios的`baseUrl`要写为`''`，即空字符串只有一个接口ip端口

た入场券/ 2021年09月29日 03:48/ 0 赞/ 490 阅读

相关 vue 中 axios 全局配置

在请求接口的时候做全局处理, 便于管理和维护 axios 全局配置 base.js import axios from "axios"; import q

青旅半醒/ 2021年09月19日 08:22/ 0 赞/ 498 阅读