使用 babel-plugin-import 插件来按需引入 Element Plus 组件可以减少最终构建的体积，因为只有实际用到的组件和样式会被包含进来。以下是如何配置 babel-plugin-import 来按需引入 Element Plus 的步骤：

  1. 安装 babel-plugin-import： 如果你还没有安装这个插件，可以使用 npm 或者 yarn 来安装它： 

    npm install babel-plugin-import --save-dev
# 或者
yarn add babel-plugin-import --dev

  2. 配置 .babelrc 或 babel.config.js： 在你的项目根目录下，找到或创建 .babelrc 文件，或者在 babel.config.js 中添加以下配置： 

    // .babelrc
{
  "plugins": [
    ["import", {
      "libraryName": "element-plus",
      "libraryDirectory": "es",
      "style": "true"
    }, "element-plus"]
  ]
}
    或者： 
    // babel.config.js
module.exports = {
  plugins: [
    [
      'import',
      {
        libraryName: 'element-plus',
        libraryDirectory: 'es',
        style: true,
      },
      'element-plus'
    ]
  ],
};

  3. 修改 main.js 或 main.ts： 在你的项目的入口文件中，你可以按需引入 Element Plus 组件库： 

    import { createApp } from 'vue'
import App from './App.vue'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import locale from 'element-plus/lib/locale/lang/zh-cn' // 例如中文语言包

const app = createApp(App)
app.use(ElementPlus, { locale })
app.mount('#app')

  4. 在组件中按需引入： 在你的 Vue 组件中，你可以直接引入你需要的 Element Plus 组件，例如： 

    <template>
  <el-button>按钮</el-button>
</template>

<script>
import { ElButton } from 'element-plus'

export default {
  components: {
    ElButton
  }
}
</script>

  5. 重新构建项目： 使用上面的配置后，当你构建项目时，只有用到的 Element Plus 组件和样式会被包含在最终的构建文件中。

确保在你的项目中正确配置了 babel-plugin-import，这样你就可以享受按需引入带来的体积优化了。