react项目在package.json中配置proxy之后,报错

$ npm run start

> img@0.1. start D:\xx\src\img
> react-scripts start When specified, "proxy" in package.json must be a string.
Instead, the type of "proxy" was "object".
Either remove "proxy" from package.json, or make it a string.
npm ERR! code ELIFECYCLE
npm ERR! errno
npm ERR! img@0.1. start: `react-scripts start`
npm ERR! Exit status
npm ERR!
npm ERR! Failed at the img@0.1. start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above. npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\xx\AppData\Roaming\npm-cache\_logs\--11T08_04_08_822Z-debug.log

原因是react-scripts模块中从2开始改变了proxy的配置方式,解决的方法有两种

第一种方式是,指定安装react-scripts的老版本

1.删除node_modules/react-scripts

2.重新安装 npm i react-scripts@1.1.1 --save

第二种方式是,使用新版本proxy的配置方法

1.安装http-proxy-middleware

$ npm install http-proxy-middleware --save
$ # or
$ yarn add http-proxy-middleware --save

2.src目录下新建文件:setupProxy.js,配置代码为:

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

module.exports = function(app) {

  app.use(proxy('/api',
{
"target": "https://localhost:5000/",
"changeOrigin": true
})) //app.use(proxy(...)) //可以配置多个代理
}

When specified, "proxy" in package.json must be a string.的更多相关文章

  1. “proxy” in package.json must be a string 解决办法

    今天学习一个react项目.想从本地服务器获取数据. 直接axios.get('http://localhost:80/api/react/header.json'),报错跨域. 网上查了下,需要在p ...

  2. 常用的package.json以及React相关

    常用的package.json以及React相关 前言 package.json 的简单介绍 简单版的 package.json 必备属性(name & version) name 字段 ve ...

  3. npm package.json属性详解

    概述 本文档是自己看官方文档的理解+翻译,内容是package.json配置里边的属性含义.package.json必须是一个严格的json文件,而不仅仅是js里边的一个对象.其中很多属性可以通过np ...

  4. NodeJS中 package.json各属性分析

    package.json 中包含各种所需模块以及项目的配置信息(名称.版本.许可证等)meta 信息. Name:它属于必须字段,在package.json中最重要的就是name和version字段, ...

  5. package.json for npm中依赖外部组件时常用的版本符号含义

    package.json中会有dependencies定义了项目依赖的外部组件,这些外部组件的依赖都是带有版本符号以表示被依赖组件的版本范围. { "dependencies" : ...

  6. package.json

    1,项目按住shift,右击鼠标:"在此处打开命令行窗口" 2,cmd输入:npm init 输入name,varsion....license项的信息,yes 3,此项目中自动创 ...

  7. nwjs 配置文件package.json 转载

    配置文件package.json nw在启动应用程序时,首先要读取package.json文件,初始化基本属性,下面我们看看package.json的完整参数.每个参数配置都标有注释. { /**指定 ...

  8. Node.js~sails.js~package.json的作用

    回到目录 我们在sails框架进行node.js开发时,会涉及到项目的迁移,当迁移后可能你的module即丢失,这时,希望快速的安装所有的包包,可以使用下面命令 1 cd 你当前的sails项目 2 ...

  9. npm中package.json详解

    通常我们使用npm init命令来创建一个npm程序时,会自动生成一个package.json文件.package.json文件会描述这个NPM包的所有相关信息,包括作者.简介.包依赖.构建等信息,格 ...

随机推荐

  1. svn使用教程(收藏)

    SVN简介: 为什么要使用SVN? 程序员在编写程序的过程中,每个程序员都会生成很多不同的版本,这就需要程序员有效的管理代码,在需要的时候可以迅速,准确取出相应的版本. Subversion是什么? ...

  2. 【洛谷P2915】Mixed Up Cows

    题目大意:给定一个长度为 N 的序列,每个位置有一个权值,现要求重新排列这个序列,使得相邻的权值差的绝对值大于 K,求合法排列的方案数. 题解: 由于 N 很小,应该可以想到状压,考虑如何进行设计状态 ...

  3. VCL界面开发必备装备!DevExpress VCL v19.1.5你值得拥有

    DevExpress VCL Controls是 Devexpress公司旗下最老牌的用户界面套包.所包含的控件有:数据录入,图表,数据分析,导航,布局,网格,日程管理,样式,打印和工作流等,让您快速 ...

  4. cookie的使用以及cookie的跨域名获取

    cookie存放容量4k左右,可设置过期时间. 1.cookie的封装使用 //设置cookies function setCookie(name, value) { var Days = 30; v ...

  5. 如何理解Hibernate的延迟加载机制?

    延迟加载就是并不是在读取的时候就把数据加载进来,而是等到使用时再加载.Hibernate使用了虚拟代理机制实现延迟加载.返回给用户的并不是实体本身,而是实体对象的代理.代理对象在用户调用getter方 ...

  6. Eclipse中SVN分支与合并

    一.创建分支 Eclipse中利用svn插件创建分支,如下图 分支创建完毕,查看svn资源库中可以看到,分支信息: 二.分支合并主干 1.切换到分支,如图 切换: 2.修改分支信息 在pojo中新增T ...

  7. 27. ClustrixDB 分布式架构/一致性、容错和可用性

    一致性 许多分布式数据库都采用最终一致性而不是强一致性来实现可伸缩性.但是,最终的一致性会增加应用程序开发人员的复杂性,他们必须针对可能出现的数据不一致的异常进行开发. ClustrixDB提供了一个 ...

  8. mysql 递归查找所有子节点

    select dept_id from ( select t1.dept_id,t1.parent_id, if(find_in_set(parent_id, @pids) > 0, @pids ...

  9. LAMP 搭建,wordpress.xcache,powerdns及poweradmin

    一,概念 CGI: CGI全称是通用网关接口(Common Gateway Interface),是外部应用程序与与服务器之间的接口标准,是在CGI程序和web服务器之间传递信息的规程 CGI是一段程 ...

  10. Git 下拉项目

    1.[VCS]> [Checkout  from  Version  Control] >  [Git] 2.项目Git路径 > [Clone]