题图 By Clm From Bingjavascript
前不久写了一篇关于react脚手架（create-react-app）配置antd中css按需加载的踩坑记录，文章内容有误，原文以下react脚手架（create-react-app）配置antd中css按需加载的坑。css
这篇文章直接修改了node_modules里面的内容，通常开发中是绝对不能这样作的，小编在整理的时候没有及时发现，真是抱歉。
java
俗话说的好，有错就要认,挨打要立正，关于后台留言的全部评论我都接受，实在抱歉。node
下面是勘误修正后的文章：
react
想利用create-react-app搭建基本项目，首先全局应该有这个工具：webpack
cnpm i create-react-app -g
在全局安装完以后，就能够利用create-react-app初始化项目了ios
create-react-app admin('项目名')// 下完包后 进入admin目录cd admin// 而后就能够将项目跑起来yarn start
这样咱们就很顺利的完成了react的基本结构搭建nginx
接下来咱们就能够在项目中配置antdgit
一、下载antd
web
cnpm i antd -S
二、配置antd按需加载css 首先下载babel-plugin-import
cnpm i babel-plugin-import -S
三、再建立.babelrc文件
{ "plugins": [ ["import", { "libraryName": "antd", "style": "css" }] ]}
四、最后在项目中引入antd组件
import { Button } from 'antd';<Button type="primary">Primary</Button><Button>Default</Button>
五、当大家看到这的时候，大家会发现，这不正常操做么，没有什么坑啊，可是你会发现antd的样式没有起做用，？？？？满脑子疑问，这里其实错的不是咱们，也不是antd，而是这个脚手架，它默认是不使用.babelrc的，它使用的是package.json中的babel配置和内部配置。
上一篇错误文章咱们在这里出错后就去修改node_modules了，这是绝对不能作的。
六、因此咱们要将脚手架的内部配置项暴露出来进行修改，使用 npm run eject这个命令来暴露配置。可是运行 npm run eject会报出下面的错误：
七、此时这个报错，须要将代码利用git提交
git add .git commit -m "init"
八、而后再从新npm run eject 此时就就不会报上面的错误了，运行npm run eject以后，项目根目录会生成config文件夹
九、找到config/webpack.config.js文件，将babelrc：false改成true，意思是启用.babelrc的配置，如图：
十、尚未完，此时若是运行项目，浏览器还会报错（天了噜，真tm想弃用....)为何会报错呢？由于上面一步开启了使用.babelrc文件，可是.babelrc的配置不正确，咱们须要修改（为何不正确呢？由于creat-react-app有一些默认的babel配置放到了package.json中）
十一、此时将package.json中的babel下面的 "presets": [ "react-app" ] 配置到 .babelrc中，并将package.json中的babel删除掉,如图：
总结一下，create-react-app的脚手架使用anted的css按需加载，因为此脚手架默认不支持使用.babelrc文件，因此须要将其配置暴露出来，须要用到npm run eject 命令，暴露配置文件后须要在config/webpack.config.js中开启使用.babelrc文件的功能，开启后配置.babelrc。配置的时候须要注意一点，将package.json中的babel配置剪贴到.babelrc中。
点击阅读原文能够查看原文章地址。
近期热门文章：
欢迎关注、转发或者点击好看
本文分享自微信公众号 - nodejs全栈开发（geekclass）。
若有侵权，请联系 support@oschina.cn 删除。
本文参与“OSC源创计划”，欢迎正在阅读的你也加入，一块儿分享。