使用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. 记录一次MyEclipse打开jsp文件出现Error的解决办法

    今天正在忙着写项目,在打开一个项目内的jsp文件时发现我亲爱的代码消失了. 最后从网上找到了解决办法,希望可以帮到有需要的人,也作为个人记录 第一步:找到安装路径MyEclipse\configura ...

  2. C# 6.0:新的Dictionary Initializer

    初始化Dictionary不是什么新东西,你可以简单的通过Collection Initializer来初始化一个Dictionary,这是从C#3.0就有的特性.Collection Initial ...

  3. [转][SqlServer]收缩日志

    USE StudyDB ; GO ALTER DATABASE StudyDB SET RECOVERY SIMPLE;--设置简单恢复模式 GO ); GO ALTER DATABASE Study ...

  4. 从9x9矩阵中抽取中间菱形区域打印 - perl

    起因: 源自于c的练习题,打印diamond,因为perl不需编译,方便调试,故先用perl实现一下 关键: 没有想到好的思路,只能借助于上一篇打印上下三角矩阵的方法,把菱形拆成上下左右4个三角矩阵区 ...

  5. 初次使用Windbg检查C#程序内存

    1. 下载windbg并安装. 我下载的是 Windbg 6.12.注意,windbg分32位和64位,由分析环境的位数决定.我这里安装的是32位的.安装过程很简单,一路next就可以. 2. 准备被 ...

  6. 适用于nodercms的打包构建脚本

    背景 最近自己用nodercms搭建了一个简单的博客系统,用户发布一些自己谁便谢谢的文章.感谢nodercms团队,这个cms轻量易用,用于做个人博客太方便了.开发了博客系统,肯定设计到部署到AWS或 ...

  7. 1-web.xml配置说明

    编写第一个Servlet程序  重要的在于如何去配置项目中的web.xml文件 <servlet-class>  设置servlet程序全限定路径 也就是在项目的中路径 <servl ...

  8. 在写WebApi判断用户权限时返回数据和接受支付结果 定义返回数据类型

    using ADT.Core.Encrypt; using System; using System.Collections.Generic; using System.Linq; using Sys ...

  9. Express路由

    1. 路由器的配置分为两个,一个是需要做页面的渲染,一个是需要直接进行对数据进行输出,对于路由器的配置需要对路由器在公共的app.js进行注册与注入才能生效,否则是不能生效的.配置时根据不同的应用场景 ...

  10. mysql 多行(GROUP_CONCAT)和多列(CONCAT)的合并函数

    1,多行合并:把查询的一行或者多行进行合并. SELECT GROUP_CONCAT(md.data1) FROM DATA md,contacts cc WHERE md.conskey=cc.id ...