create-react-app配置less

less的配置过程【 配置文件是抽离的 】

  1. create-react-app创建项目

  2. npm run eject 暴露配置项

yarn eject
  1. 安装less less-loader
yarn add less less-loader
  1. config/webpack.config.js

加在sass后面

const sassRegex = /.(scss|sass)$/;
const sassModuleRegex = /.module.(scss|sass)$/;
const lessRegex = /.(less)$/;
const lessModuleRegex = /.module.less$/;
  1. 将以下代码赋值进去

​ - https://github.com/rodchen-king/rofo-css/commit/2045d1b36cc3eb509d7f5aa874524c5bca5ec18a?diff=unified
​ - 加在sass-loader后面
​ - 然后将getLocalIdent去掉

```
    {
          test: lessRegex,
          exclude: lessModuleRegex,
          use: getStyleLoaders(
            {
              importLoaders: 2,
              sourceMap: isEnvProduction && shouldUseSourceMap,
            },
            'less-loader'
          ),
          // Don't consider CSS imports dead code even if the
          // containing package claims to have no side effects.
          // Remove this when webpack adds a warning or an error for this.
          // See https://github.com/webpack/webpack/issues/6571
          sideEffects: true,
        },
        // Adds support for CSS Modules, but using SASS
        // using the extension .module.scss or .module.sass
        {
          test: lessModuleRegex,
          use: getStyleLoaders(
            {
              importLoaders: 2,
              sourceMap: isEnvProduction && shouldUseSourceMap,
              modules: true,
            },
            'less-loader'
          ),
        },
原文地址:https://www.cnblogs.com/xz233/p/13720659.html