addLessLoader issue when using less-loader

I’m using react-app-rewired and I’ve recently updated less-loader to the new version (6.0.0). My customize-cra version is 0.9.1.

I’m getting the following error when I run react-app-rewired build:

ValidationError: Invalid options object. Less Loader has been initialized using an options object that does not match the API schema. options has an unknown property ‘source’. These properties are valid: object { lessOptions?, prependData?, appendData?, sourceMap? }

I’ve the config-overrides.js file like this:

const { override, fixBabelImports, addLessLoader } = require("customize-cra");

module.exports = override(
  fixBabelImports("import", {
    libraryName: "antd",
    libraryDirectory: "es",
    style: true
  }),
  addLessLoader({
    lessOptions: {
      javascriptEnabled: true,
      modifyVars: {
        "@primary-color": "#030852", // primary color for all components
      }
    }
  })
);

I added the lessOptions object but it didn’t solve the problem. Could you tell me which is the proper way to set addLessLoader options?

Thanks in advance,

[okankrdg]

I solved fix by installing customize-cra-less-loader

package.json:

"customize-cra": "^1.0.0",
"customize-cra-less-loader": "^2.0.0",
"less": "^4.1.2",
"less-loader": "^10.2.0",

config-override.js:

const { override } = require("customize-cra");
const addLessLoader = require("customize-cra-less-loader");
const path = require("path");

module.exports = override(
  addLessLoader({
    javascriptEnabled: true,
  })
);

[renhao123]

same problem ！！！ I‘ve rolled back the less and less-loader edit to 2.73 , 4.10. Then the problem resolved. but, it’s really not a good ideal.