0

I used create-react-app(typescripts) to build a project, and added antd@3.26.13 with customize-cra as the website I was following told me.

I would like use the module.css, and I want to use module.less, like css, but encountered some error messages:

./src/layout/basic.module.less (./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-8-1!./node_modules/postcss-loader/src??postcss!./node_modules/less-loader/dist/cjs.js??ref--6-oneOf-8-3!./src/layout/basic.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? }

My code follows:

const {
    override,
    addWebpackAlias,
    fixBabelImports,
    addLessLoader,
    addDecoratorsLegacy
} = require('customize-cra');

module.exports = override(
    addWebpackAlias({
        "@":require('path').resolve(__dirname,"src")
    }),
    fixBabelImports('import',{
        libraryName:'antd',
        libraryDirectory:'es',
        style:true
    }),
    addLessLoader({
        javascriptEnabled:true,
        modifyVars:{'@primary-color':'#1DA57A'},
    }),
    addDecoratorsLegacy()
);
David Buck
  • 3,752
  • 35
  • 31
  • 35
pengbo liu
  • 3
  • 1
  • 2

1 Answers1

2

The current version of customize-cra isn't compatible with the latest version of create-react-app, to be precise with css-loader. Try to install customize-cra@next to get alpha version. They fixed that issue there.

Andrey Tarasov
  • 58
  • 7
  • If anyone is interested, this is the GitHub PR that gives the context about the fix mentioned here: https://github.com/arackaf/customize-cra/pull/243 – Yohan Liyanage May 28 '20 at 13:49