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
})
);
};

5. 参考链接

create-react-app 构建的项目使用代理 proxy的更多相关文章

  1. 13.create-react-app 构建的项目使用代理 proxy

    1. 正常运行 npm run eject 2. create-react-app 的版本在低于 2.0 的时候可以在 package.json 增加 proxy 配置, 配置成如下: "p ...

  2. 深入 Create React App 核心概念

    本文差点难产而死.因为总结的过程中,多次怀疑本文是对官方文档的直接翻译和简单诺列:同时官方文档很全面,全范围的介绍无疑加深了写作的心智负担.但在最终的梳理中,发现走出了一条与众不同的路,于是坚持分享出 ...

  3. 在 .NET Core 5 中集成 Create React app

    翻译自 Camilo Reyes 2021年2月22日的文章 <Integrate Create React app with .NET Core 5> [1] Camilo Reyes ...

  4. 如何扩展 Create React App 的 Webpack 配置

    如何扩展 Create React App 的 Webpack 配置  原文地址https://zhaozhiming.github.io/blog/2018/01/08/create-react-a ...

  5. tap news:week5 0.0 create react app

    参考https://blog.csdn.net/qtfying/article/details/78665664 先创建文件夹 安装create react app 这个脚手架(facebook官方提 ...

  6. 使用create react app教程

    This project was bootstrapped with Create React App. Below you will find some information on how to ...

  7. Create React App

    Facebook开源了React前端框架(MIT Licence),也同时提供了React脚手架 - create-react-app. create-react-app遵循约定优于配置(Coc)的原 ...

  8. Create React App 安装less 报错

    执行npm run eject 暴露模块 安装 npm i  less less-loader -D 1.打开 react app 的 webpack.config.js const sassRege ...

  9. create react app 项目部署在Spring(Tomcat)项目中

    网上看了许多,大多数都是nginx做成静态项目,但是这样局限性太多,与Web项目相比许多服务端想做的验证都很麻烦,于是开始了艰难的探索之路,终于在不经意间试出来了,一把辛酸... 正常的打包就不说了. ...

随机推荐

  1. (二) JPA基础

    一.什么是JAP JPA(Java Persistence API)是SUN官方推出的Java持久化规范,它为Java开发人员提供了一种对象/关联映射工具来管理Java应用中的关系数据.它的出现主要是 ...

  2. svn之合并分支

    学习连接 svn的merge使用例子

  3. 运维MES的日子里

    可以看下<工业软件国内与国外差距,越来越小还是越来越大>.<MES技术国内现状与未来发展趋势>及<国际主要MES厂商>,总结来说中国工业是进步的,工业软件也是进步的 ...

  4. Go 修改字符串中的字符(中文乱码)

    问题复现:修改字符串的第一个中文 先对原字符串做切片,然后进行拼接,得到新的字符串 func ModifyString(str string) string { tempStr := str[1:] ...

  5. Java 面向对象_继承

    继承 在继承的关系中,子类就是一个父类,也就是说,子类可以被当做父类看待,例如:父类是员工,子类是程序员,那么程序员就是一个员工,代码示例: // 员工类 public class Employee{ ...

  6. myeclipse 添加反编译插件

    文件下载地址: 链接: https://pan.baidu.com/s/1th2goaA2aS45kO84dX1Bdg 密码: g1fu 先关闭myeclipse1.下载jad1.5.8g 下载后解压 ...

  7. 补充:HTML标签和CSS

    角标标签: 上角标:sup 下角标:sub <!DOCTYPE html> <html> <head> <meta charset="UTF-8&q ...

  8. 使用Tampermonkey,实现Gitlab禁用自我Merge的功能

    Tampermonkey 简单入门资料:https://blog.csdn.net/gg_18826075157/article/details/78011162 Tampermonkey下载地址:T ...

  9. input 更改 pleaseholder 的字体样式

    /* WebKit browsers */input::-webkit-input-placeholder {    color: red;    font-size: 14px;}/* Mozill ...

  10. 学习Python编程的最好的几本书

    读书是汲取某个特定学科的知识以及更深入的理解该学科的最好的方式.在这个科技世界,通晓计算机系统各个不同的技术领域是至关重要的.其中最重要的内容之一便是计算机程序语言.现今,计算机中存在许多不同类型的程 ...