1.执行eject后,再次启动项目报错

情景:使用create-react-app搭建了项目,启动没有问题,然后执行 $ yarn eject 暴露出webpack配置文件等,再次 $ yarn start 启动报错

提示:Cannot find module 'babel-loader'。

解决办法:执行 $ yarn install 重新安装一遍依赖即可解决。

2.配置less和引入antd后报错

情景:项目中先eject暴露出了配置,然后修改webpack.config.dev.js配置支持less,修改方法参考的网上:

1.安装less和less-loader

执行 $ yarn add less less-loader

版本号为:

"less": "^3.8.1",
"less-loader": "^4.1.0",

2.test: /\.css$/    改为      test: /\.(css|less)$/

3.use数组末尾中加入

{
loader: require.resolve('less-loader'), // compiles Less to CSS
}

4.exclude修改

exclude: [/\.(js|jsx|mjs)$/, /\.html$/, /\.json$/, /\.(css|less)$/],

然后进行测试,修改App.css为App.less,运行成功。

紧接着引入antd,修改按需加载,然后报错

解决办法:less3.X以后的版本需要增加  javascriptEnabled: true 即:

{
loader: require.resolve('less-loader'), // compiles Less to CSS
options: { javascriptEnabled: true }
}

学习React中遇到的问题的更多相关文章

  1. Immutable学习及 React 中的实践

    为什么用immutable.js呢.有了immutable.js可以大大提升react的性能. JavaScript 中的对象一般是可变的(Mutable),因为使用了引用赋值,新的对象简单的引用了原 ...

  2. React中setState学习总结

    react中setState方法到底是异步还是同步,其实这个是分在什么条件下是异步或者同步. 1.先来回顾一下react组件中改变state的几种方式: import React, { Compone ...

  3. CSS modules 与 React中实践

    最近一直在学习React,看上去蛮简单的内容,其实学习曲线还是比较高的. 目前学到css绑定的问题,看到有一篇好的文章,就转过来了. CSS 模块化的解决方案有很多,但主要有两类.一类是彻底抛弃 CS ...

  4. 正式学习React(五) react-redux源码分析

    磨刀不误砍柴工,咱先把react-redux里的工具函数分析一下: 源码点这里  shallowEqual.js export default function shallowEqual(objA, ...

  5. 正式学习React(一) 开始学习之前必读

    为什么要加这个必读!因为webpack本身是基于node环境的, 里面会涉及很多路径问题,我们可能对paths怎么写!webpack又是怎么找到这些paths的很迷惑. 本文是我已经写完正式学习Rea ...

  6. 正式学习 react(三)

    有了基础的webpack基础,我们要对react的基本语法进行学习. 我这个教程全部用es6 实现.可能会忽略一些最基本的语法讲解,这些你在官网上或者其他别的地方都比我讲的全. 今天我要讲一下reac ...

  7. Immutable 详解及 React 中实践

    本文转自:https://github.com/camsong/blog/issues/3 Shared mutable state is the root of all evil(共享的可变状态是万 ...

  8. React中使用CSSTransitionGroup插件实现轮播图

    动画效果,是一个页面上必不可少的功能,学习一个新的东西,当然就要学习,如何用新的东西,用它的方法去实现以前的东西啦.今天呢,我就在这里介绍一个试用react-addons-css-transition ...

  9. 照着官方文档学习react

    笨人学习法 10000个小时策略来学习,因为笨.先照着官方文档敲一遍,写一遍. 准备 先要准备环境.搭建一个基于webpack的react环境:Hello ReactJS. demo: https:/ ...

随机推荐

  1. chrome瀏覽器去掉緩存的方法

    方法一: 1.開發說打開開發者工具 勾選這個訪問可以 方法二: command+shift+R

  2. 事务之二:spring事务(事务管理方式,事务5隔离级别,7个事务传播行为,spring事务回滚条件)

    事物管理对于企业应用来说是至关重要的,好使出现异常情况,它也可以保证数据的一致性. spring支持编程式事务管理和声明式事务管理两种方式. 编程式事务管理使用TransactionTemplate或 ...

  3. HTML注册页面验证注册信息

    在这里主要介绍两种验证方式,一种是点击注册按钮后会提示最上方的出错位置,弹出窗口提示格式不对.另一种是利用鼠标事件,在鼠标进行不同操作时会有不同的click事件. 这两种都是利用javascript, ...

  4. 【OpenCV函数】轮廓提取;轮廓绘制;轮廓面积;外接矩形

    FindContours 在二值图像中寻找轮廓  int cvFindContours( CvArr* image, CvMemStorage* storage, CvSeq** first_cont ...

  5. 自定义条件判断两对象相等Equals的方法

    自定义两对象是否相等方法,必须用到GetHashCode方法,如 public class AirspaceCompareByUUID : IEqualityComparer<AIRSPACE_ ...

  6. 2014.8.8 CAD系统连接

    CDA数据库连接生产库.研发库.临时库对应3个连接名 cad = (DESCRIPTION = (ADDRESS = (PROTOCOL = TCP)(HOST = backupserver)(POR ...

  7. Python可执行对象——exec、eval、compile

    Python提供的调用可执行对象的内建函数进行说明,涉及exec.eval.compile三个函数.exec语句用来执行存储在代码对象.字符串.文件中的Python语句,eval语句用来计算存储在代码 ...

  8. 浅析bootstrap原理及优缺点

    网格系统的实现原理,是通过定义容器大小,平分12份(也有平分成24份或32份,但12份是最常见的),再调整内外边距,最后结合媒体查询,就制作出了强大的响应式网格系统   网格系统的实现原理,是通过定义 ...

  9. Delphi Help

    http://docwiki.embarcadero.com/CodeExamples/Seattle/en/Category:Content_by_Version

  10. 数据仓库-数据采集-ETL漫谈

    数据仓库之ETL漫谈ETL,Extraction-Transformation-Loading的缩写,中文名称为数据抽取.转换和加载.大多数据仓库的数据架构可以概括为:数据源-->ODS(操作型 ...