使用create-react-app创建的项目,要使用ant design。

1、首先进入项目根目录,yarn add antd.

2、在App.css引入 样式文件,@import '~antd/dist/antd.css';

3、需要是用的地方引入,import { Button, Icon } from 'antd';

然后代码里面直接使用即可

         <Button type="primary">按钮1</Button>
<Button type="dashed">按钮2</Button>
<Button type="danger">按钮3</Button>

不知道这个是不是按需加载,按照官方做法会报错,一时研究不明白,哎,,,先这样凑活用着。

在create-react-app里使用ant design的更多相关文章

  1. 深入 Create React App 核心概念

    本文差点难产而死.因为总结的过程中,多次怀疑本文是对官方文档的直接翻译和简单诺列:同时官方文档很全面,全范围的介绍无疑加深了写作的心智负担.但在最终的梳理中,发现走出了一条与众不同的路,于是坚持分享出 ...

  2. tap news:week5 0.0 create react app

    参考https://blog.csdn.net/qtfying/article/details/78665664 先创建文件夹 安装create react app 这个脚手架(facebook官方提 ...

  3. 使用create react app教程

    This project was bootstrapped with Create React App. Below you will find some information on how to ...

  4. 如何扩展 Create React App 的 Webpack 配置

    如何扩展 Create React App 的 Webpack 配置  原文地址https://zhaozhiming.github.io/blog/2018/01/08/create-react-a ...

  5. 在 .NET Core 5 中集成 Create React app

    翻译自 Camilo Reyes 2021年2月22日的文章 <Integrate Create React app with .NET Core 5> [1] Camilo Reyes ...

  6. 使用Facebook的create-react-app脚手架快速构建React开发环境(ant.design,redux......)

    编程领域中的“脚手架(Scaffolding)”指的是能够快速搭建项目“骨架”的一类工具.例如大多数的React项目都有src,public,webpack配置文件等等,而src目录中又包含compo ...

  7. 十九、React UI框架Antd(Ant Design)的使用——及react Antd的使用 button组件 Icon组件 Layout组件 DatePicker日期组件

    一.Antd(Ant Design)的使用:引入全部Css样式 1.1 antd官网: https://ant.design/docs/react/introduce-cn 1.2 React中使用A ...

  8. Create React App

    Facebook开源了React前端框架(MIT Licence),也同时提供了React脚手架 - create-react-app. create-react-app遵循约定优于配置(Coc)的原 ...

  9. Create React App 安装less 报错

    执行npm run eject 暴露模块 安装 npm i  less less-loader -D 1.打开 react app 的 webpack.config.js const sassRege ...

随机推荐

  1. 纪念使用FTPClient工具所遇到的

    我所使用的是org.apache.commons.net.ftp.FTPClient.  查了资料还有其余几个FTPClient,其余的先不展开. 1.ftpClient.changeWorkingD ...

  2. Vue基础开发笔记

    以下实例代码地址:https://github.com/NewBLife/VueDev 1,Vue组件导入 新建组件:Header.vue <template> <div> & ...

  3. 海量数据中的TOPK问题小结

    1.利用堆找出最大的K个数 首先,先理解下用堆找出最大的K个数的常用解法,例如问题是“从M(M <= 10000)个数中找出最大的K个数” (1)利用最大堆 建立一个N=M大小的大顶堆,然后输出 ...

  4. @EnableEurekaServer无法正常import原因是spring-cloud-dependencies版本太低

    去maven repository 库里 http://mvnrepository.com/artifact/org.springframework.cloud/spring-cloud-depend ...

  5. 7.6.1 continue 语句

    7.6.1 continue 语句 3种循环都可以使用CONTINUE语句.执行到该语句时,会跳过本次迭代的剩余部分,并开始下一轮迭代.如果continue语句在嵌套循环内,则只会影响包含该语句的内层 ...

  6. excle删除重复项的行,自定义删除第几个

    在B1输入 =COUNTIF(A$1:A1,A1) 下拉,会有数字1.2.1.2 第二步,选中B列升序排序,排序后,将B列为1的整行删除即可. 再补充下,这样是以姓名为条件来筛选,不会影响你的数据.你 ...

  7. 表单数据转javabean对象

  8. 自定义项目启动初始化信息的listener报错

    自定义初始化组件代码如下: @Component public class InitComponent implements ServletContextListener, ApplicationCo ...

  9. WebApi的好处和MVC的区别

    1.WebApiwebapi有自己的路由. webservice和wcf的协议都是soap协议,数据的序列化和反序列化都是soap的格式.而webapi是Json的数据传递 webapi的优点有哪些? ...

  10. memset与fill的区别

    简介与区别 memset函数 按照字节填充某字符 在头文件<cstring>里面 fill函数 按照单元赋值,将一个区间的元素都赋同一个值 在头文件<algorithm>里面 ...