webpack 4弹出反应应用添加较少配置时出错

Question

嗨，我弹出CRA来添加更少的配置，但是我遇到了这样的错误

(./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-3-1!./node_modules/less-loader/dist/cjs.js??ref--6-oneOf-3-2!./node_modules/postcss-loader/src??postcss!./src/index.css)

webpack版本-4，我添加了更少的配置，但得到了错误，我还安装了引导css，它还会出现类似cli中"{“缺失的错误。

  const getStyleLoaders = (cssOptions, preProcessor) => {
    const loaders = [
      isEnvDevelopment && require.resolve('style-loader'),
      isEnvProduction && {
        options: paths.publicUrlOrPath.startsWith('.')
          ? { publicPath: '../../' }
          : {},
      },
      {
        loader: require.resolve('css-loader'),
        options: cssOptions,
      },
      {
        loader: require.resolve('less-loader'), //added less here
        options: cssOptions,
      },
      {
        loader: require.resolve('postcss-loader'),
        options: {
          ident: 'postcss',
          plugins: () => [
            require.resolve('autoprefixer'),
            require('postcss-flexbugs-fixes'),
            require('postcss-preset-env')({
              autoprefixer: {
                flexbox: 'no-2009',
              },
              stage: 3,
            }),
            postcssNormalize(),
          ],
          sourceMap: isEnvProduction && shouldUseSourceMap,
        },
      },

下决心

    //less loader
    {
      test:'/\.less$/',
      include: lessModuleRegex,
      use: getStyleLoaders({
        importLoaders: 1,
        sourceMap: isEnvProduction && shouldUseSourceMap,
      },
      'less-loader'
      ),
      sideEffects: true,
    },
    {
      test: /\.module\.less$/,
      use: getStyleLoaders({
        importLoaders: 1,
        sourceMap: isEnvProduction && shouldUseSourceMap,
        modules: {
          getLocalIdent: getCSSModuleLocalIdent,
        },
      },
      'less-loader'
      ),
    },

如何在CRA中添加更少的内容？

Answer 1

对我来说，通过添加这个规则(只是不需要在webpack.config.js中做更多的更改)就可以解决这个问题：

           {
              test: /\.less$/,
              use: getStyleLoaders(
                {
                  importLoaders: 3,
                  sourceMap: isEnvProduction && shouldUseSourceMap,
                  modules: {
                    getLocalIdent: getCSSModuleLocalIdent,
                  },
                },
                'less-loader'
              ),
            },

另外，确保您使用的是最新版本的less-loader