使用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. 基于javaMail的邮件发送--excel作为附件

    基于JavaMail的Java邮件发送 Author xiuhong.chen@hand-china.com Desc 简单邮件发送 Date 2017/12/8 项目中需要根据物料资质的状况实时给用 ...

  2. [转摘]VMware下Windows系统出现大量可删除ATA Channel的解决办法

    编辑VMX配置文件加上一句话就可以了 devices.hotplug = "false" 原文:http://blog.ihipop.info/2015/05/4830.html

  3. Spark环境准备

    Ubuntu: 1.下载spark-2.2.1-bin-hadoop2.7.tgz,解压即可使用. 2.下载jdk-8u151-linux-x64.tar.gz,解压. 3.执行spark-2.2.1 ...

  4. C#中基于GDI+(Graphics)图像处理系列

    https://blog.csdn.net/lhtzbj12/article/details/54024821

  5. gridview使用小知识

    1.列改变为select,不能使用gridview.SelectedRow.Cells[0].Text 2.事件执行顺序 RowCommandPageIndexChangingPageIndexCha ...

  6. Python【每日一问】07

    问:请解释使用 *args 和 **kwargs 的含义 答: *args:可变参数,表示将实参中按照位置传值,多余的值都给 args,多余的实参被打包成 tuple(元组),然后传递给函数调用 # ...

  7. .net 多线程之async await

    主线程遇到await 关键字后就交给子线程执行了 先定义一个task 可以让主线程和子线程同时执行,通过await关键字可以让主线程等待子线程执行完毕,await后面的代码可以视为异步方法的回调,可以 ...

  8. NPOI 导出Excel部分

    ) { MessageBox.Show("没有找到相关的数据!", "系统提示", MessageBoxButtons.OK, MessageBoxIcon.I ...

  9. 记录4-Ubuntu 16.04用gparted调整分区

    几天在安装双系统时,没注意居然把swap分区设置成了50G.今天才发现,于是用gparted重新分区. 1. sudo apt-get install gparted 2. 重新用u盘启动进入ubun ...

  10. nil/Nil/NULL/NSNull

    nil/Nil/NULL/NSNull的区别 一个简单的小例子: NSObject *obj = nil; NSLog(@"%@",obj); =>null NSObject ...