Импорт .less в компоненты React после customize-cra

Question

Я использую antd, и у меня есть стартовый проект, созданный из cra, как подробно описано здесь: https://github.com/ant-design/create-react-app-antd

package.json

"dependencies": {
"antd": "^4.1.3",
"babel-plugin-import": "^1.13.0",
"customize-cra": "^0.9.1",
"less": "^3.11.1",
"less-loader": "^5.0.0",
"react": "^16.13.1",
"react-app-rewired": "^2.1.5",
"react-dom": "^16.13.1",
"react-scripts": "3.4.1"
},

config-overrides.js

module.exports = override(
  fixBabelImports('import', {
    libraryName: 'antd',
    libraryDirectory: 'es',
    style: true,
  }),
  addLessLoader({
    javascriptEnabled: true,
    modifyVars: { '@primary-color': '#25b864' },
  }),
);

Кажется, что основной цвет применяется, как и ожидалось. Однако в любом отдельном компоненте, когда я пытаюсь сделать

import styles from './index.less';
....
<div className={styles.right}>

Не работает. Имя класса не подобрано

....
<div className={'right'}>

Работает даже без импорта

Похоже, это уже упоминается как вопрос здесь