create-react-app+react-app-rewired引入antd实践
注:模块化按此方发
npm install antd --save
npm install babel-plugin-import --save-dev
npm install react-app-rewired customize-cra
修改package.json下的

改成(如下图)
"scripts": {
"start": "react-app-rewired start",
"build": "react-app-rewired build",
"test": "react-app-rewired test --env=jsdom",
"eject": "react-app-rewired eject"
}

在项目根目录下(和 package.json 同级)新建配置文件 config-overrides.js ,并添加如下内容,这是默认的,
module.exports = function override(config, env) {
// 在这里添加配置
return config;
}
如果要接入第三方要这样
const { override, fixBabelImports } = require('customize-cra');
module.exports = override(
fixBabelImports('import', {
libraryName: 'antd',
libraryDirectory: 'es',
style: 'css',
}),
);
如果报错了那肯定是看了网上的文章

那肯定是没有安装 customize-cra
https://ant.design/docs/react/use-with-create-react-app-cn(把这个页面好好看看)

create-react-app+react-app-rewired引入antd实践的更多相关文章
- 《React后台管理系统实战 :一》:目录结构、引入antd、引入路由、写login页面、使用antd的form登录组件、form前台验证、高阶函数/组件
实战 上接,笔记:https://blog.csdn.net/u010132177/article/details/104150177 https://gitee.com/pasaulis/react ...
- 从0开始,手把手教你使用React开发答题App
项目演示地址 项目演示地址 项目源码 项目源码 其他版本教程 Vue版本 小程序版本 项目代码结构 前言 React 框架的优雅不言而喻,组件化的编程思想使得React框架开发的项目代码简洁,易懂,但 ...
- React Native是一套使用 React 构建 Native app 的编程框架
React Native是一套使用 React 构建 Native app 的编程框架 React Native at first sight what is React Native? 跟据官方的描 ...
- React Native发布APP之打包iOS应用
用React Native开发好APP之后,如何将APP发布以供用户使用呢?一款APP的发布流程无外乎:签名打包—>发布到各store这两大步骤.本文将向大家分享如何签名打包一款React Na ...
- React Native & CodePush & App Center
React Native & CodePush & App Center https://docs.microsoft.com/en-us/appcenter/distribution ...
- 七天接手react项目 系列 —— 尾篇(antd 和 mobx)
其他章节请看: 七天接手react项目 系列 尾篇 前面我们依次学习了 react 基础知识.react 脚手架创建项目.react 路由,已经花费了不少时间,但距离接手 spug_web 项目还有一 ...
- [React] Create and import React components with Markdown using MDXC
In this lesson I demonstrate how to use the library MDXC to create and import React components with ...
- 【共享单车】—— React后台管理系统开发手记:AntD Table基础表格
前言:以下内容基于React全家桶+AntD实战课程的学习实践过程记录.最终成果github地址:https://github.com/66Web/react-antd-manager,欢迎star. ...
- 【共享单车】—— React后台管理系统开发手记:AntD Form基础组件
前言:以下内容基于React全家桶+AntD实战课程的学习实践过程记录.最终成果github地址:https://github.com/66Web/react-antd-manager,欢迎star. ...
随机推荐
- 2031 HDOJ 进制转换
Problem Description 输入一个十进制数N,将它转换成R进制数输出. Input 输入数据包含多个测试实例,每个测试实例包含两个整数N(32位整数)和R(2<=R<=1 ...
- backbone.js 教程(1) View & Model & Collection
Backbone.js Overview 它由Jeremy Ashkenas开发,最初发行于2010-10-13 它是一个轻量的JavaScript类库,只依赖于underscore.js,非强制依赖 ...
- java 编码设计细节
1.hibernate注解 @Validated({ APIGetsGroup.class })@NotBlank(message = "{cameraReceive.captureId.e ...
- 单例模式 之 单例模式——Holder
之前我写过 单例模式中的饿汉模式和懒汉模式 他们虽然都能实现单例模式 但是优缺点很明显 饿汉模式:不能懒加载(类加载就会被实例化),消耗很大,在并发情况下安全性很高. 懒汉模式:能实现懒加载,但是在并 ...
- Centos7 升级php版本到php7
一.首先查看是否有老版本 yum list installed | grep php 二.如果安装的有 yum remove php.x86_64 php-cli.x86_64 php-common. ...
- python-day1(学前了解)
Markdown基本语法 各级标题 # 一级标题 ## 二级标题 ### 三级标题 #### 四级标题 ##### 五级标题 加粗 **加粗文本** 斜体 *我斜了* 高亮 ==我高亮了== 上标 2 ...
- [Wpf]在C#中添加 collectionViewSource
Products = new ObservableCollection<Product>(products); ProductOptions = new ObservableCollect ...
- 在html中展示pdf
pc端 插件: https://pdfobject.com/ 使用: <!doctype html> <html lang="en"> <head&g ...
- ECharts 中的事件和行为
在 ECharts 的图表中用户的操作将会触发相应的事件.开发者可以监听这些事件,然后通过回调函数做相应的处理,比如跳转到一个地址,或者弹出对话框,或者做数据下钻等等. 如下是一个绑定点击操作的示例. ...
- init, telinit - 进程处理初始化
总览 /sbin/init [ -a ] [ -s ] [ -b ] [ -z xxx ] [ 0123456Ss ] /sbin/telinit [ -t 秒 ] [ 0123456sSQqabcU ...