React項(xiàng)目中使用less

1.安裝less，less-loader兩個(gè)包

2.yarn eject暴露出webpack配置（我這里使用的yarn使用npm的命令是：npm run eject）

3.修改webpack配置，我使用的react版本是16.12.0

修改這個(gè)文件，這里有三種修改方式：

一、在webpack配置中你會(huì)發(fā)現(xiàn)配置了sass，把所有的sass配置換成less的配置

? ? 缺點(diǎn)是無法再使用sass

二、同樣的在webpack同樣的地方，定義sass正則的地方，同樣定義一份less的正則

然后，搜索在配置文件中搜索sassRegex和sassModuleReges，將這兩個(gè)配置復(fù)制一份，把sass改成less，把sass-loader改成less-loader

? ? 缺點(diǎn)是代碼冗余，在實(shí)際開發(fā)中我們不一定兩者都要使用，二選一

三、找到cssRegex定義的地方，校對(duì)css的正則修改為/\.(css|less)$/，然后找到getStyleLoaders ，往下找loader的依賴，先找style-loader,再往下找到css-loader，在跟css-loader同級(jí)的地方，添加一個(gè)less-loader的依賴關(guān)系

4.這時(shí)重啟項(xiàng)目，一定要重啟，一定要重啟，一定要重啟，就能看到less生效了

如果項(xiàng)目在重啟過程中有報(bào)錯(cuò)缺少包，缺少什么安裝什么包就可以了

按需引入Antd

1.安裝antd

2.安裝 babel-plugin-import

3.打開package.json找到babel配置項(xiàng)（如果沒有暴露webpack配置的需要先暴露配置）

4.在babel配置項(xiàng)中添加這么一段