react 配置ant时遇见的一个Error: Multiple configuration files found. Please remove one: – package.json#babel – .babelrc 解决方案

摘要:
问题是createreatapp中的包。“babel”:{“presets”:[“react app”]}的配置已在json中配置,但在根目录中创建了一个babelrc文件,这会导致重复,但不能直接删除,否则会报告编译失败。/src/index。jsSyntaxError:D:WorkReactProsrcindex.js

这个问题是create react app 里面的package.json里面已经配置了

  "babel": {
    "presets": [
      "react-app"
    ]
  }
这样的配置,但是又在根目录下建立了一个babelrc的文件,所以导致重复,但是不可以直接删掉,不然报
 
编译失败
./src/index.js
SyntaxError: D:WorkReactProsrcindex.js: Unexpected token (9:16)

类似这样的错误,所以要把

  "presets": [
      "react-app"
    ]
配置放在babelrc里面,这个的意思是说
 
指定按照react-app的模式配置babel
,最终我的babel是这么配置的:
{
    "plugins": [
        ["import", { "libraryName": "antd", "style": "css" }]
    ],
    "presets": [
        "react-app"
    ]
}

问题解决,这样的按需引入插件可以比全局引入减少1.2-1.5M左右的大小

 关于,babel的一些配置解释,可以参考这个文章:
 
 
 

免责声明:文章转载自《react 配置ant时遇见的一个Error: Multiple configuration files found. Please remove one: – package.json#babel – .babelrc 解决方案》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇MAC自带的SVN进行升级使用echarts插件,多次加载出现There is a chart instance already initialized on the dom,报的警告,看不下去啦下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

react异步数据如ajax请求应该放在哪个生命周期?

react请求接口数据是在componentDidMount 还是componentWillMount周期好?React数据获取为什么一定要在componentDidMount里面调用? 对于同步的状态改变,是可以放在componentWillMount,对于异步的,最好好放在componentDidMount。但如果此时有若干细节需要处理,比如你的组件需...

React Native中加载指示器组件ActivityIndicator使用方法

这里讲一下React Native中的一个组件——ActivityIndicator,这是一个加载指示器,俗称菊花,很常见的,效果如下所示: 可以看到图中有两个加载指示器,一大一小,这是尺寸不是我设置的,这个组件本身就有一个属性是设置其大小的,两个选项,一大一小。这里顺便就介绍一些该组件的属性: animating:这个参数接受布尔型的值,表示是否显示...

react hook+antd实现点击发送验证码功能

要实现的效果如图,点击发送验证码,文字变为60秒后重新发送,并且开始倒计时 这是写成一个组件格式component -> eidtPass.tsx import React, { useState } from 'react'import { Modal, Form, Input, notification } from 'antd'import...

React Native组件

1.<TextInput />             autoCapitalize="none"  //自动记录历史输入值             autoCorrect={true} //自动纠正             placeholder="search for a project"  //提示文字             edita...

React16源码解读:开篇带你搞懂几个面试考点

引言 如今,主流的前端框架React,Vue和Angular在前端领域已成三足鼎立之势,基于前端技术栈的发展现状,大大小小的公司或多或少也会使用其中某一项或者多项技术栈,那么掌握并熟练使用其中至少一种也成为了前端人员必不可少的技能饭碗。当然,框架的部分实现细节也常成为面试中的考察要点,因此,一方面为了应付面试官的连番追问,另一方面为了提升自己的技能水平,还...

[RN] React Native 实现 类似京东 的 沉浸式状态栏和搜索栏

React Native 实现 类似京东 的 沉浸式状态栏和搜索栏 其原理其实就是在要 隐藏 部分的那个View 前面加入 StatusBar 代码! 代码如下: <StatusBar animated={true} //指定状态栏的变化是否应以动画形式呈现。目前支持这几种样式:backgroundColor, barStyle和hidden h...