鍍金池/ 問(wèn)答/HTML/ 后端路由的項(xiàng)目使用 webpack 的 devServer.proxy 的一個(gè)問(wèn)

后端路由的項(xiàng)目使用 webpack 的 devServer.proxy 的一個(gè)問(wèn)題

假設(shè)有個(gè)后端路由的項(xiàng)目，本地路由已經(jīng)配置好，可以打開(kāi) www.abc.com/a.html, www.abc.com/b.html 等頁(yè)面，想用 webpack 進(jìn)行前端開(kāi)發(fā)。

因?yàn)?webpack-dev-server 起的本地服務(wù)都是 localhost，需要將所有的請(qǐng)求都 proxy 到 www.abc.com，所以做如下配置：

devServer: {
  proxy: {
    "/": {
      target: "http://www.abc.com",
      changeOrigin: true
    }
  }
}

但是尷尬的是用命令行 webpack-dev-server 啟動(dòng)服務(wù)后，輸入 localhost:8080 直接會(huì)重定向到 www.abc.com 導(dǎo)致打包的 js 404。

提問(wèn)：如何使得 url 不重定向？還是我某步姿勢(shì)有錯(cuò)誤？

回答
編輯回答
神曲

不是很明白你的需求，當(dāng)你的localhost:8080 重定向到 www.abc.com ,所有的資源直接取得的是www.abc.com下的資源，何來(lái)404？

2017年7月8日 12:36
編輯回答
帥到炸

你這個(gè)當(dāng)然會(huì)重定向了，因?yàn)槟愕那岸寺酚啥x了path: '/'，而你的反向代理又寫(xiě)了'/'，結(jié)果可想而知，你現(xiàn)在要做的就是把這個(gè)'/'改成不會(huì)沖突的名稱，比如下面這樣：

devServer: {
  proxy: {
    "/abc": {
      target: "http://www.abc.com",
      changeOrigin: true,
      pathRewrite: {
         '^/abc': ''
      }
    }
  }
}
2017年1月10日 14:29