首页 > 解决方案 > 在 React.js 应用程序中覆盖 Ant 设计配置

问题描述

我正在使用 React.js 构建应用程序。另外我正在使用 Ant 设计来创建 UI。根据ant设计文档

我们可以在 ant design 中覆盖默认颜色和其他样式。根据它我可以添加:

// webpack.config.js
module.exports = {
  rules: [{
    test: /\.less$/,
    use: [{
      loader: 'style-loader',
    }, {
      loader: 'css-loader', // translates CSS into CommonJS
    }, {
      loader: 'less-loader', // compiles Less to CSS
+     options: {
+       lessOptions: { // If you are using less-loader@5 please spread the lessOptions to options directly
+         modifyVars: {
+           'primary-color': '#1DA57A',
+           'link-color': '#1DA57A',
+           'border-radius-base': '2px',
+         },
+         javascriptEnabled: true,
+       },
+     },
    }],
  }],
}

但是当我添加这段代码时,我没有得到任何结果。
我应该添加另一个代码以使我的代码可行还是可能是什么问题?如何使用上述配置更改默认样式?

标签: reactjsantd

解决方案


推荐阅读