babel-plugin-import

babel-plugin-import 是一个 Babel 插件，用于优化 JavaScript 代码中的模块导入语句。它的作用是按需加载模块，减小打包后的文件体积，提升页面加载速度。

当使用 ES6 模块语法（import/export）导入模块时，通常会将整个模块都导入进来，即使只使用了其中的部分内容。而 babel-plugin-import 可以将这种按需加载的机制应用到代码中，只导入需要的部分。

具体来说，babel-plugin-import 可以将形如 `import { Button } from 'antd'` 的导入语句转换为 `import Button from 'antd/lib/button'`，只导入 Button 组件所在的文件，而不是整个 antd 库。这样可以减小打包后的文件体积，并且不会加载无用的代码。

使用 babel-plugin-import 需要在 Babel 配置文件中进行配置，示例配置如下：

{
  "plugins": [
    ["import", {
      "libraryName": "antd",
      "style": "css"
    }]
  ]
}

上述配置表示使用 babel-plugin-import 对 antd 库进行按需加载，同时加载 CSS 样式。通过指定 `libraryName` 和 `style` 来配置需要按需加载的库和样式。

总而言之，babel-plugin-import 可以提升代码的性能和加载速度，特别适用于大型项目和 UI 库的开发。