create-react-app使用less

1、第一步

npm i less less-loader --save-dev 安裝less

npm run eject 顯示config文件夾

 

 2、第二步

找到webpack.config.js，在下圖相應位置添加相應內容

 

 3、第三步

在rules中添加如下代碼，rules位置如下圖

 

 添加

   {
              test: lessRegex,
              exclude: lessModuleRegex,
              use: getStyleLoaders(
                {
                  importLoaders: 2,
                  sourceMap: isEnvProduction
                    ? shouldUseSourceMap
                    : isEnvDevelopment,
                },
                'less-loader'
              ),   
              sideEffects: true,
            },
          
            {
              test: lessModuleRegex,
              use: getStyleLoaders(
                {
                  importLoaders: 2,
                  sourceMap: isEnvProduction
                    ? shouldUseSourceMap
                    : isEnvDevelopment,
                  modules: true,
                  getLocalIdent: getCSSModuleLocalIdent,
                },
                'less-loader'
              ),
            },

這樣就可以新建less文件了，並正常使用了。