javascript - 如何以正确的方式捆绑 AntD？

Question

这将是我第一次在项目中不使用 CRA，因此请遵循本指南 here .

在标题Customize Theme下。我正在尝试导入 ant.design 默认样式(如果可能，如果未导入组件，则不导入样式？)并能够覆盖它。我不知道从这里到底该去哪里。如何在 .babelrc 中实现 less/less-loader 部分？

此外，我希望能够利用 babel-plugin-import这样我就可以按需调用该组件，因为看起来我正在导入整个库。

{
  "presets": [
    "@babel/preset-env",
    "@babel/preset-react"
  ],
  "plugins": [
    "@babel/plugin-proposal-class-properties",
    [
      "import",
      {
        "libraryName": "antd",
        "libraryDirectory": "es"
      }
    ]
  ]
}

Answer 1

我遇到了同样的问题，但我解决了。在根目录中创建一个文件 webpackrc 并粘贴以下脚本

{
"extraBabelPlugins": [
["import", { "libraryName": "antd", "libraryDirectory": "es", "style": "css" }]
]
}

或者尝试用这个导入 antd css -

@import '~antd/dist/antd.css';

到 App.css 和 Index.css 之一/两者的顶部。

希望有帮助!