module.exports = {
  devServer: {
    // 配置服務(wù)器代理
    proxy: {
      "/api": { // 代理接口前綴為/apis的請求
        "target": 'http://localhost:3000/', // 對應(yīng)的代理地址
        "secure": false, // 接受運(yùn)行在https上，默認(rèn)不接受
        "changeOrigin": true, // 如果設(shè)置為true,那么本地會虛擬一個服務(wù)器接收你的請求并代你發(fā)送該請求，這樣就不會有跨域問題（只適合開發(fā)環(huán)境）
        "pathRewrite": { //重寫路徑 比如'/apis/aaa/ccc'重寫為'/aaa/ccc'
          '^/api': ''
        }
      },
      // 配置多個代理
      "/service": {
        "target": 'https://www.google.com/',
        "secure": false,
        "changeOrigin": true,
      },
    }
  },
}

vue3.0配置代理的兩種方式

很多人如果換一個時間認(rèn)識，就會有不同的結(jié)局。

第一種

proxy: {
        '/apis': {
          target: 'https://xxxxxxx.com/', // target host
          ws: true, // proxy websockets 
          changeOrigin: true, // needed for virtual hosted sites
          pathRewrite: {
            '^/apis': '' // rewrite path
          }
        },
      }

將項目里面的這個地方改為空就OK

第二種

通過.env 文件

注意: 可以看這篇文章這里

VUE_APP_是規(guī)定的命名格式

然后通過獲取環(huán)境變量配置就OK!!

俺已經(jīng)試過了, 是OK的!!!

總結(jié)

以上為個人經(jīng)驗(yàn)，希望能給大家一個參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

Spring Boot/VUE中路由傳遞參數(shù)的實(shí)現(xiàn)代碼
在路由時傳遞參數(shù)，一般有兩種形式，一種是拼接在url地址中，另一種是查詢參數(shù)。這篇文章主要介紹了Spring Boot/VUE中路由傳遞參數(shù),需要的朋友可以參考下
2018-03-03
Vue之Pinia狀態(tài)管理
這篇文章主要介紹了Vue中Pinia狀態(tài)管理，Pinia開始于大概2019年，其目的是設(shè)計一個擁有組合式 API 的 Vue 狀態(tài)管理庫，Pinia本質(zhì)上依然是一個狀態(tài)管理庫，用于跨組件、頁面進(jìn)行狀態(tài)共享，感興趣的同學(xué)可以參考閱讀
2023-04-04
vue3中引入svg矢量圖的實(shí)現(xiàn)示例
在項目開發(fā)過程中,我們經(jīng)常會用到svg矢量圖,本文主要介紹了vue3中引入svg矢量圖的實(shí)現(xiàn)示例,具有一定的參考價值,感興趣的可以了解一下
2023-11-11
使用 vue 實(shí)現(xiàn)滅霸打響指英雄消失的效果附demo
這篇文章主要介紹了使用 vue 實(shí)現(xiàn)滅霸打響指英雄消失的效果 demo,需要的朋友可以參考下
2019-05-05
vue3 Vite 進(jìn)階rollup命令行使用詳解
這篇文章主要介紹了vue3 Vite 進(jìn)階rollup命令行使用詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
2022-08-08
vue element 中的table動態(tài)渲染實(shí)現(xiàn)（動態(tài)表頭）
這篇文章主要介紹了vue element 中的table動態(tài)渲染實(shí)現(xiàn)（動態(tài)表頭），文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2019-11-11
vue組件發(fā)布到npm簡單步驟
給大家講解一下vue組件發(fā)布到npm簡單方法和步驟過程，需要的朋友一起學(xué)習(xí)參考一下。
2017-11-11
關(guān)于在Vue中import和require的用法分析
在Vue項目中，我們經(jīng)常需要引入外部的模塊或文件，這時候就會用到import和require這兩個關(guān)鍵字，本文將詳細(xì)分析它們的用法，并提供具體的代碼實(shí)例和解釋,需要的朋友可以參考下
2023-06-06
使用vscode格式化文檔無效的解決辦法(vue代碼格式化文檔無效)
這篇文章主要給大家介紹了關(guān)于使用vscode格式化文檔無效的解決辦法,也就是vue代碼格式化文檔無效,這是最近突然遇到的一個問題,這里給大家介紹一下解決的辦法,需要的朋友可以參考下
2023-08-08
在elementui中Notification組件添加點(diǎn)擊事件實(shí)例
這篇文章主要介紹了在elementui中Notification組件添加點(diǎn)擊事件實(shí)例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2020-11-11