react暴露后，webpack4.28.3实现按需加载antd

Question

问题描述

使用 yarn eject暴露webpack配置文件，实现antd的按需加载，配置webpack文件以及package.json文件报错

问题出现的环境背景及自己尝试过哪些方法

相关插件版本号："babel-plugin-import": "^1.11.0","less-loader": "^4.1.0","less": "^3.9.0","webpack": "4.28.3","antd": "^3.15.2"

查过很多方法，但是都没找到解决方式

相关代码

下面是涉及到的配置文件编码，以及工具版本号

    if (preProcessor) {
      let loader = require.resolve(preProcessor)
      if (preProcessor === "less-loader") {
        loader = {
          loader,
          options: {
            modifyVars: { //自定义主题
              'primary-color':' #1890ff ',
            },
            javascriptEnabled: true,
          }
        }
      }
      loaders.push(loader);
    }
    return loaders;
  };

来自webpack-config.js

  "babel": {
    "presets": [
      "react-app"
    ],
    "plugins": [
      [
        "import",
        {
          "libraryName": "antd",
          "libraryDirectory": "es",
          "style": true
        },
        "antd"
      ]
    ]
  }

来自package.json

Answer 1

跟配置没关系吧，你按需引入就好了。

Answer 2

antd 官网上：

// .babelrc or babel-loader option
{
  "plugins": [
    ["import", {
      "libraryName": "antd",
      "libraryDirectory": "es",
      "style": "css" // `style: true` 会加载 less 文件
    }]
  ]
}

你的 plugins 里最后多了个 "antd" ?

Answer 3

上述配置生效