antd 学习1

简介: 1. 安装yarn add antd

1. 安装

yarn add antd

2.antd的按需引入+自定主题

2.1 安装依赖:

yarn add react-app-rewired customize-cra babel-plugin-import less@3.12.2 less-loader@7.1.0

(这里安装less和less-loader指定版本是因为现在安装的less和less-loader版本较高,配置完会报错)


2.2 修改package.json

scripts": {
"start": "react-app-rewired start",
"build": "react-app-rewired build",
"test": "react-app-rewired test",
"eject": "react-scripts eject"
},

2.3 根目录下创建config-overrides.js

//配置具体的修改规则
const { override, fixBabelImports,addLessLoader} = require('customize-cra');
module.exports = override(
fixBabelImports('import', {
libraryName: 'antd',
libraryDirectory: 'es',
style: true,
}),
addLessLoader({
lessOptions:{
javascriptEnabled: true,
modifyVars: { '@primary-color': 'green' },
}
}),
);


2.4 备注:不用在组件里亲自引入样式了,即:import 'antd/dist/antd.css'应该删掉


相关文章
|
2月前
|
前端开发 JavaScript 测试技术
从零开始搭建react+typescript+antd+redux+less+vw自适应项目
从零开始搭建react+typescript+antd+redux+less+vw自适应项目
90 0
|
2月前
|
前端开发 JavaScript 数据安全/隐私保护
详解React antd中setFieldsValu的简便使用
详解React antd中setFieldsValu的简便使用
77 0
|
27天前
|
资源调度 前端开发
|
27天前
|
资源调度 前端开发
|
2月前
|
JavaScript 前端开发 API
Vue和React,哪个在移动端开发更适合呢
【4月更文挑战第10天】Vue和React在移动端各有优势。Vue以其简单易用、渐进式开发和性能优化吸引开发者,适合初学者和快速迭代项目。而React凭借强大的生态系统、组件化开发模式和卓越性能,尤其在复杂应用和依赖特定库时更具优势。选择应基于项目需求、团队技术栈及性能要求,可先进行技术调研和原型开发。
75 4
|
2月前
|
前端开发 JavaScript 架构师
react+typescript+umi+dva+antd
react+typescript+umi+dva+antd
56 0
|
12月前
|
前端开发 JavaScript
学习React Hooks和TypeScript打造的仿Antd的UI组件库
✨ RockUI 学习React Hooks和TypeScript实现仿Antd的react UI组件库,并通过此组件库在create-react-app的基础上实现了一套简单的应用,下方链接 样式解决方案——saas 测试——Jest框架 Icon库基于react-fontawesome github 文档 文档使用storybook进行展示 使用eslint和prettier对代码风格进行约束 使用见README.md,学习及开发中的问题与解决见STUDY_README.md
104 0
|
12月前
|
Web App开发 JavaScript 前端开发
开发一个 React 和 Vue 都能用的组件?基于 Lit 和 Tailwind
开发一个 React 和 Vue 都能用的组件?基于 Lit 和 Tailwind
410 0
|
前端开发 JavaScript 数据建模
|
前端开发
react笔记之引入FontAwesome
react笔记之引入FontAwesome
131 0