create-react-app 构建的项目使用代理 proxy
Posted 飞翔蓝天的小猪
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了create-react-app 构建的项目使用代理 proxy相关的知识,希望对你有一定的参考价值。
1. 正常运行 npm run eject (前三个步骤可省略,最好的是按照第四步操作)
2. create-react-app 的版本在低于 2.0 的时候可以在 package.json 增加 proxy 配置, 配置成如下:
"proxy":{ "/fans/**":{ "target":"https://easy-mock.com/mock/5c0f31837214cf627b8d43f0/", "changeOrigin": true } }
3. create-react-app 的版本高于 2.0 版本的时候在 package.json 只能配置 string 类型, 配置成如下:
"proxy": "https://easy-mock.com/mock/5c0f31837214cf627b8d43f0/",
4. 更好的配置,建立 src/setupProxy.js 文件,npm 安装 install http-proxy-middleware , 配置成如下:(可配置多个代理)
const proxy = require("http-proxy-middleware"); module.exports = function(app) { app.use( proxy("/base/**", { target: "http://45.32.15.21:8090/", changeOrigin: true }) ); app.use( proxy("/fans/**", { target: "https://easy-mock.com/mock/5c0f31837214cf627b8d43f0/", changeOrigin: true }) ); };
以上是关于create-react-app 构建的项目使用代理 proxy的主要内容,如果未能解决你的问题,请参考以下文章
create-react-app 构建的项目使用代理 proxy
使用 create-react-app 快速构建 React 开发环境
React使用 create-react-app 快速构建 React 开发环境
create-react-app 构建的项目使用 css module 方式来书写 css
使用Facebook的create-react-app脚手架快速构建React开发环境(ant.design,redux......)