以下为学习react技术栈开发过程中，遇到的问题以及解决方法总结。各位看官请往下瞧！☆〜（ゝ。∂）
如何引入antd
第一步：安装antd
yarn add antd -S
第二步：安装babel-plugin-import，让antd样式按需加载
yarn add babel-plugin-import -S
第三步：配置babel-plugin-import的方式有两种
方式一：配置package.json
在根目录下的package.json的label下的presets后面添加
"plugins":[["import"，{"libraryName": "antd", "style": "css"}]]
如下所示：
"babel": {
"presets": [
"react-app"
],
"plugins": [
[
"import",
{
"libraryName": "antd",
"style": "css"
}
]
]
}
方式二：新建.babelrc文件配置
在根目录下新建文件.babelrc，再将package.json中的“babel”对象全部删除。在.babelrc中配置
{
"presets": [
"react-app"
],
"plugins": [
[
"import",
{
"libraryName": "antd",
"style": "css"
}
]
]
}
在这里插入图片描述
再到命令行执行
yarn eject
将react-scripts的配置释放出来。
之后，
再到config/webpack.config.js文件中全局搜索找到babelrc配置项，将其设置为true（只有设置为true，才会从.babelrc中去读取配置），默认为false。
在这里插入图片描述
第四步：使用antd组件，重启项目即可生效
快去试试吧！
问题：
成功引入antd后，只用antd UI组件返现样式不生效？
解决：
- 按照上面步骤，从上往下检查一下，看是否babel-plugin-import配置正确？
- 若你babel-plugin-import是按照方式二配置的，且babel配置没有问题，那么请在config/webpack.config.js文件中找一下test: cssRegex,这个配置，是否有配置
modules: {
getLocalIdent: getCSSModuleLocalIdent,
},
若有请去掉这个配置，再重启，就ok了
在这里插入图片描述
原因：
getCSSModuleLocalIdent是让css模块化的配置，就是说配置上后，你要在页面中使用css，得这样用
在这里插入图片描述
使用"对象."的方式获取class。
因为加上了getCSSModuleLocalIdent，而antd组件中css并不是这样引入使用的，所以导致了class没生效。
