使用代理

webpack-dev-server 可以將一些請求代理到其他伺服器。當你要將請求傳送到同一域時,這可能對開發 API 客戶端很有用。

代理通過 proxy 引數配置。

將伺服器傳遞給/api 到其他服務偵聽埠 8080 的 dev 伺服器的配置示例可能如下所示

// webpack.config.js
module.exports = {
  ...
  devServer: {
    proxy: {
      "/api": {
        target: "http://localhost:8080"
      }
    }
  }
...
}

改寫

可以使用 pathRewrite 選項重寫目標路徑。

假設你要從上一個示例中刪除/api 字首,你的配置可能看起來像

// webpack.config.js
  ...
  devServer: {
    proxy: {
      "/api": {
        target: "http://localhost:8080",
        pathRewrite: {"^/api" : ""}
      }
    }
  }
...

請求/api/user/256 將轉換為 http://localhost:8080/user/256

過濾

可以僅代理一些請求。bypass 允許你提供函式,返回值將確定是否應該代理請求。

假設你只想代理 POST 請求到/api 並讓 webpack 處理其餘部分你的配置可能看起來像這樣

// webpack.config.js
  ...
  devServer: {
    proxy: {
      "/api": {
        target: "http://localhost:8080",
        bypass: function(req, res, proxyOptions) {
          if(req.method != 'POST') return false;
        }
      }
    }
  }
...