antd是蚂蚁金服推出的一款很棒的react ui库。
官方网站:https://ant.design/docs/react/introduce-cn
首先要有react环境
安装:npm install antd --save
使用:import { 组件名称 } from 'antd'(比如import { Switch } from 'antd')
还要引用其样式:import 'antd/dist/antd.css'
但是这样直接引用样式会有一些不必要的组件也被引入进来 需要配置webpack进行按需加载
安装babel-plugin-import
npm install babel-plugin-import --save-dev
配置webpack:
{
test: /\.(js|jsx)$/,
exclude: /node_modules/,
loader: "babel-loader",
query:
{
presets:['es2015','react'],
plugins: [
["import",{libraryName: "antd",style: "css"}] //按需加载
]
},
},
放在module rules下面
上述配置完毕
直接使用组件
<Switch defaultChecked={false} />
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。