React脚手架create-react-app不支持less，因此需要配置webpack的webpack.config.js文件。
在使用React脚手架的时候，可能发现是没有webpack.config.js文件的。运行npm run eject，会多出两个目录config和scripts，此时可以在config目录下看到配置文件webpack.config.js。
下载less less-loader
使用 npm 或 yarn 下载均可：
// 使用npm
npm install less less-loader --save-dev
// 使用 yarn
yarn add less less-loader
配置 webpack.config.js文件
第一步
React脚手架是支持sass的，因此可以像配置sass一样配置less就可以。在webpack.config.js文件中找到下面这几行代码，定义less变量。
第二步
在module属性下的rules中添加less的loader处理，找到sass的配置，对照配置一份。
修改的地方有三处，如下图我选中的红色选框：
分别替换成 lessRegex, lessModuleRegex, ‘less-loader‘ 并保存 如下图：
这样就可以在组件中直接使用less了。