注:模块化按此方发
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实践的更多相关文章

  1. 《React后台管理系统实战 :一》:目录结构、引入antd、引入路由、写login页面、使用antd的form登录组件、form前台验证、高阶函数/组件

    实战 上接,笔记:https://blog.csdn.net/u010132177/article/details/104150177 https://gitee.com/pasaulis/react ...

  2. 从0开始,手把手教你使用React开发答题App

    项目演示地址 项目演示地址 项目源码 项目源码 其他版本教程 Vue版本 小程序版本 项目代码结构 前言 React 框架的优雅不言而喻,组件化的编程思想使得React框架开发的项目代码简洁,易懂,但 ...

  3. React Native是一套使用 React 构建 Native app 的编程框架

    React Native是一套使用 React 构建 Native app 的编程框架 React Native at first sight what is React Native? 跟据官方的描 ...

  4. React Native发布APP之打包iOS应用

    用React Native开发好APP之后,如何将APP发布以供用户使用呢?一款APP的发布流程无外乎:签名打包—>发布到各store这两大步骤.本文将向大家分享如何签名打包一款React Na ...

  5. React Native & CodePush & App Center

    React Native & CodePush & App Center https://docs.microsoft.com/en-us/appcenter/distribution ...

  6. 七天接手react项目 系列 —— 尾篇(antd 和 mobx)

    其他章节请看: 七天接手react项目 系列 尾篇 前面我们依次学习了 react 基础知识.react 脚手架创建项目.react 路由,已经花费了不少时间,但距离接手 spug_web 项目还有一 ...

  7. [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 ...

  8. 【共享单车】—— React后台管理系统开发手记:AntD Table基础表格

    前言:以下内容基于React全家桶+AntD实战课程的学习实践过程记录.最终成果github地址:https://github.com/66Web/react-antd-manager,欢迎star. ...

  9. 【共享单车】—— React后台管理系统开发手记:AntD Form基础组件

    前言:以下内容基于React全家桶+AntD实战课程的学习实践过程记录.最终成果github地址:https://github.com/66Web/react-antd-manager,欢迎star. ...

随机推荐

  1. 【VS开发】cmd dos 批处理重命名文件

    原文地址:http://hi.baidu.com/benchoi/item/c1f531f5f1367b0b85d2785b 批处理实现文件批量重命名并自动加递增序列号 有时我们想把一些图片批量重命名 ...

  2. 使用自定义View

    1 关于自定义的View的构造函数 java中对构造函数只是调用,不继承.因为整个UI是android系统提供的框架,因此构造函数需要写成它要求的格式,即和View的构造函数一样. 自定义的View中 ...

  3. 开发完成的springboot项目扩展 swagger

    第一步:pom.xml 引入 swagger 配置 <swagger.version>2.9.2</swagger.version> <!--swagger start- ...

  4. mysql 加密 解密函数

    select   HEX(AES_ENCRYPT('你好世界','ABC123456')) select   AES_DECRYPT(UNHEX('E85A104B6142A7375E53C0545C ...

  5. shell基础#1

    shell:能直接调用命令(python)1.bash的基本特性 ctrl+L 清屏2.IO重定向与管道符 都由shell提供 命令是一个可执行的二进制程序3.编程基础 编程原理 程序:执行某个功能的 ...

  6. 优雅的用两种方式爬网络 txt 文件【雾

    TXT 文件?? (笑 这里爬的是 74xsw (咱好像也不怎么逛的网站)的英雄再临 ... 请注意这并不是教程,只是贴个代码仅供参考而已[雾 这里 用的 getTXT 的方式有两种,一种是每个章节分 ...

  7. 修改文件夹的所有者为www

    切换到root用户:su - root 修改文件所属用户和用户组:chown 用户:用户组 文件名如果用户和用户组是www,那么需要执行命令如下:chown www:www filename -R ( ...

  8. ES各种操作的过程

    参考:https://blog.csdn.net/better_xf/article/details/81188050 一.es写入数据的过程 客户端选择一个node发送请求过去,这个node就是co ...

  9. Java 迪杰斯特拉算法实现查找最短距离

    迪杰斯特拉算法 迪杰斯特拉算法是由荷兰计算机科学家狄克斯特拉于1959 年提出的,因此又叫狄克斯特拉算法.是从一个顶点到其余各顶点的最短路径算法,解决的是有向图中最短路径问题.迪杰斯特拉算法主要特点是 ...

  10. python gRPC简单示例

    Ubuntu18.04安装gRPC protobuf-compiler-grpc安装 sudo apt-get install protobuf-compiler-grpc protobuf-comp ...