http-proxy-middleware报错“proxy is not a function“

最新推荐文章于 2024-08-09 07:19:33 发布

置顶 DxCaesar

最新推荐文章于 2024-08-09 07:19:33 发布

阅读量964

点赞数 1

分类专栏：问题求解 React 前端文章标签： react js proxy

本文链接：https://blog.csdn.net/DxCaesar/article/details/109570258

版权

React 同时被 3 个专栏收录

15 篇文章 0 订阅

订阅专栏

问题求解

6 篇文章 1 订阅

订阅专栏

前端

6 篇文章 0 订阅

订阅专栏

近期重新搭建了一个react脚手架项目，因为是前后端分离开发的，所以前后端的交互因为端口不同而产生跨域，过去通常是使用配置http-proxy-middleware中间间来处理跨域，在src目录下新建setupProxy.js文件，并写入以下代码，即可实现跨域：

const proxy = require('http-proxy-middleware')

module.exports = function (app) {
  app.use(proxy('/_api', {
    target: 'http://localhost:8080/',
    changeOrigin: true,
    pathRewrite: {
      "^/_api": "/"
     }
  }))
}

但是这次将这个文件复制到新项目下，启动项目时却发生了报错：

setupProxy报错

错误是proxy is not a function。

查看文档之后发现官方文档的写法居然变了。。。官方在1.0.0版本后废弃了proxy方法，改为使用createProxyMiddleware。对应写法为：

const { createProxyMiddleware } = require('http-proxy-middleware')

module.exports = function (app) {
  app.use(
    '/_api',
    createProxyMiddleware({
      target: 'http://localhost:8080/',
      changeOrigin: true,
      pathRewrite: {
        "^/_api": "/"
      }
    })
  )
}