实战build-react(二)-------引入Ant Design
安装 Ant Design
npm install antd --save
或
yarn add antd
注释:https://www.jianshu.com/p/21caf40ee93e(copy)
然后在开发的过程中,慢慢替换跟舍弃material UI。然而之后的开发,我也发现了Ant Design的弊端,
那就是组件基本上是完全没有办法自定义样式,基本上所有组件都不接收style参数。想要换个颜色?不行。
想要改个大小?也不行。
npm install babel-plugin-import --save
"plugins": [
["import", {
"libraryName": "antd",
"libraryDirectory": "es",
"style": "css"
}]
]

"dependencies": {
"antd": "^3.18.1",
"axios": "^0.18.0",
"babel-plugin-import": "^1.10.0",
"react": "^16.8.6",
"react-dom": "^16.8.6",
"react-scripts": "3.0.1",
"redux": "^4.0.1"
},
"devDependencies": {
"babel-cli": "^6.26.0",
"json-server": "^0.14.2",
"mockjs": "^1.0.1-beta3",
"webpack": "4.29.6"
},
//再尝试正常顺序然后,在手动分dependencies和devDependencies,但不知道对线上是否有影响
最后网上看到有大神指导,看下一篇文章
实战build-react(二)-------引入Ant Design的更多相关文章
- React组件库Ant Design的安装与使用
一.什么是 Ant Design 1.Ant Design 提炼自企业级中后台产品的交互语言和视觉风格 2.Ant Design 使用 TypeScript 构建,提供完整的类型定义文件 二.Ant ...
- 测试平台系列(5) 引入Ant Design Pro
引入Ant Design Pro 回顾 还是继续回顾下之前的作业, 返回的中文变成了ascii字符,不要紧,我们光荣地百度一哈. 随便点进去看看,都可以找到正确答案: 可以看到,我们需要修改confi ...
- react 编写 基于ant.design 页面的参考笔记
前言 因为我没有系统的学习 react,是边写边通过搜索引擎找相对的问题,看 ant.design的 中文文档 编写的一个单页面, 以下的笔记都是写 gksvideourlr 时记录的. 重新设定表单 ...
- 实战build-react(二)-------引入Ant Design(增加)
https://blog.csdn.net/zhan_lijian/article/details/85271906(copy) 1.肯定参考facebook关于react官网咯 快速搭建 creat ...
- create-react-app 引入ant design 及 使用 less
全局引入: 第一步:全局安装 create-react-app npm install create-react-app -g 第二步:安装 yarn npm install -g yarn 第三步: ...
- React学习及实例开发(二)——用Ant Design写一个简单页面
本文基于React v16.4.1 初学react,有理解不对的地方,欢迎批评指正^_^ 一.引入Ant Design 1.安装antd yarn add antd 2.引入 react-app-re ...
- 【React自制全家桶】一、Webstrom+React+Ant Design+echarts搭建react项目
前言 一.React是Facebook推出的一个前端框架,之前被用于著名的社交媒体Instagram中,后来由于取得了不错的反响,于是Facebook决定将其开源.出身名门的React也不负众望,成功 ...
- 基于Ant Design UI框架的React项目
概述 这款基于React开发的UI框架,界面非常简洁美观,在这篇文章中我主要为大家介绍一下如何用Ant开始搭建React项目 详细 代码下载:http://www.demodashi.com/demo ...
- React + Ant Design网页,配置
第一个React + Ant Design网页(一.配置+编写主页) 引用博主的另外一篇VUE2.0+ElementUI教程, 请移步: https://blog.csdn.net/u0129070 ...
随机推荐
- k8s-kubernettes-sercet存储
Secret Secret存在意义 Secret解决了密码.token.密钥等敏感数据的配置问题,而不需要把这些敏感数据暴露到镜像或者Pod Spec中.Secret可以以Volume或者环境变量的方 ...
- PTA 7-20 表达式转换
转自:https://www.cnblogs.com/yuxiaoba/p/8399934.html 算术表达式有前缀表示法.中缀表示法和后缀表示法等形式.日常使用的算术表达式是采用中缀表示法,即二元 ...
- hbase的读写过程
hbase的读写过程: hbase的架构: Hbase真实数据hbase真实数据存储在hdfs上,通过配置文件的hbase.rootdir属性可知,文件在/user/hbase/下hdfs dfs - ...
- start-all.sh启动HDFS,datanode没有启动
第一次格式化dfs后,启动并使用hadoop,之后如果再次重新执行了格式化(hdfs namenode -format) start-all.sh启动时就会遇到datanode无法启动的问题,通常情况 ...
- mysql for update 高并发 死锁研究
mysql for update语句 https://www.cnblogs.com/jtlgb/p/8359266.html For update带来的思考 http://www.cnblo ...
- Oracle数据库跟踪存储过程
1.[右击]该存储过程 ——>勾选[添加调试信息]——>点击[测试]选项 2.输入对应参数,点击下图左上角红框按钮,开始跟踪,可逐语句逐过程跟踪
- Django 前端通过json 取出后端数据
Django 前端通过json 取出后端数据 前端通过json 取出后端数据 步骤1:后台数据通过 JSON 序列化成字符串a 注意:1.json是1个字符串 2.通过json.dumps('xx ...
- Linux如何查看进程是否启动,查看端口占用
Linux系统中经常需要查看某个进程是否已经启动,启动位置在哪里,某个端口是否被占用,被哪个进程占用等,这些都可以通过命令来完成,本文讲述如何查看进程是否启动,查看端口占用 1.通过ps -ef | ...
- 在 Chrome DevTools 中调试 JavaScript 入门
第 1 步:重现错误 找到一系列可一致重现错误的操作始终是调试的第一步. 点击 Open Demo. 演示页面随即在新标签中打开. OPEN DEMO 在 Number 1 文本框中输入 5. 在 N ...
- 01Spring基于xml的IOC配置--入门
01Spring基于xml的IOC配置 1.创建一个普通的maven工程 1.1 选择maven,不用骨架,点击下一步. 1.2 填写GroupId.ArtifactId.Version.填完点击下一 ...