Enable CSS Module report an error

[ghost]

Hi, I tried to enable CSS module support for less, but when the project started, I encountered an error and couldn't continue:

./src/App.module.less (./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-8-1!./node_modules/postcss-loader/src??postcss!./node_modules/resolve-url-loader??ref--6-oneOf-8-3!./node_modules/less-loader/dist/cjs.js??ref--6-oneOf-8-4!./src/App.module.less)
ValidationError: Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
 - options has an unknown property 'localIdentName'. These properties are valid:
   object { url?, import?, modules?, sourceMap?, importLoaders?, localsConvention?, onlyLocals?, esModule? }

Here is my config:

// Don't open the browser during development
process.env.BROWSER = "none";

module.exports = {
  plugins: [
    {
      plugin: require('craco-less'),
      options: {
        modifyLessRule: function (lessRule, _context) {
          lessRule.test = /\.(module)\.(less)$/;
          lessRule.exclude = /node_modules/;
          return lessRule;
        },
        cssLoaderOptions: {
          modules: true,
          localIdentName: "[local]_[hash:base64:8]"
        }
      }
    }
  ]
};

How can I solve this problem? Thank you!

[ghost]

Hi, I fixed this error:

// Don't open the browser during development
process.env.BROWSER = "none";

module.exports = {
  plugins: [
    {
      plugin: require('craco-less'), // Enable less support.
    },
    {
      plugin: require('craco-less'), // Enable less support with CSS module.
      options: {
        modifyLessRule: function (lessRule, _context) {
          lessRule.test = /\.(module)\.(less)$/;
          lessRule.exclude = /node_modules/;
          return lessRule;
        },
        cssLoaderOptions: {
          modules: {
            localIdentName: "[hash]",
          }
        }
      }
    }
  ]
};