React脚手架首次创建，支持的样式文件css、sass，并不支持 .less 样式文件，因此我们在对组件样式编写时，如果没有配置 less 文件信息，我们写的 less 样式表就不会生效，下面我们开始对less 信息进行配置
1. React脚手架在默认生成时，并不会将 webpack.confing.js 的配置信息暴露出来
使用
npm run eject
&
yarn eject
命令
此前我们一定要将本地仓库的 git 代码进行提交，如果有更改后未提交的代码，会报错
遇到这样的报错信息，我们将本地仓库的代码提交后，重新运行 yarn eject 即可，命令运行成功后，本地目录会生成 config 文件夹，该文件夹内就是该项目的 webpack 所有配置信息
2. 下载 less 所需的包
使用
npm i less less-loader --save
或
yarn add less less-loader
命令
包下载完成后，我们可以在 package.json 中查看到 less 包信息
3. 在 webpack.config.js 中添加 less 配置信息
打开 config 目录下的 webpack.config.js 文件，因为我们要添加的 less 和React脚手架默认的 css、sass 都是样式文件，因此，我们在 webpack.config.js 文件中，使用 ctrl+F 全局搜索 sass或css
在这里仿照sass和css添加 less 的配置信息
const lessRegex = /\.less$/;const lessModuleRegex = /\.module\.less$/;
在 style files regexes 下添加完 less 的配置信息后
全局搜索 oneof ，在 sass 后添加 less 的配置信息，如下
{test: lessRegex,exclude: lessModuleRegex,use: getStyleLoaders({importLoaders: 3,sourceMap: isEnvProduction? shouldUseSourceMap: isEnvDevelopment,modules: {mode: 'icss',},},'less-loader'),},{test: lessModuleRegex,use: getStyleLoaders({importLoaders: 3,sourceMap: isEnvProduction? shouldUseSourceMap: isEnvDevelopment,modules: {mode: 'local',getLocalIdent: getCSSModuleLocalIdent,},},'less-loader'),},
配置完成后，保存即可，再对组件添加 .less 样式，我们就可以发现 .less 样式文件已经生效，这表示我们已经配置好了
