如何为React App应用antd深色主题？

Question

我想在我的新React Web应用程序中使用这个深色主题：https://github.com/ant-design/ant-design-dark-theme

遵循自定义主题here的说明和自述文件here中应用主题的说明之后，我的config-overrides.js看起来像这样：

const { darkTheme } = require('@ant-design/dark-theme');
const { override, fixBabelImports, addLessLoader } = require('customize-cra');

module.exports = override(
  fixBabelImports('import', {
    libraryName: 'antd',
    libraryDirectory: 'es',
    style: true,
  }),
  addLessLoader({
    javascriptEnabled: true,
    modifyVars: darkTheme
  }),
);

这似乎不起作用。例如，我有一个菜单antd组件仍然以“浅色”主题而不是“深色”主题显示。

我想让我所有的antd组件都使用深色主题进行渲染，而无需我明确设置它。那可能吗？如果是，我在做什么错？

这里不是前端开发人员，所以如果我缺少明显的内容，请告诉我。

Answer 1

当默认导出是带有变量的对象时，代码将破坏默认导出。因此，应为：

const darkTheme = require('@ant-design/dark-theme');
const { override, fixBabelImports, addLessLoader } = require('customize-cra');

module.exports = override(
  fixBabelImports('import', {
    libraryName: 'antd',
    libraryDirectory: 'es',
    style: true,
  }),
  addLessLoader({
    javascriptEnabled: true,
    modifyVars: darkTheme
  }),
);