React脚手架配置less

create-react-app版本号： 4.0.3

1 暴露webpack配置

1. npm i less less-loader@5.0.0 --save，注意这里的less-loader一定要指定版本，过高版本的less-loader不行，会报错TypeError: this.getOptions is not a function

2. yarn eject暴露出webpack配置项

3. 找到webpack配置文件webpack.config.js，该文件中对于sass文件进行了配置，所以可以直接仿照sass文件的配置配置less

4. 全局搜索sass,找到下面图片的内容，添加对于less的处理
   

5. 在rules中仿照sass的配置添加less的配置

// less and lessModule
{
   
  test: lessRegex,
  exclude: sassModuleRegex,
  use: getStyleLoaders(
    {
   
      importLoaders: 3,
      sourceMap: isEnvProduction
        ? shouldUseSourceMap
        : isEnvDevelopment,
    },
    "less-loader"
  ),
  sideEffects: true,