Vue3 项目使用 unplugin-auto-import 自动导入 Element Plus 图标

在 Vue3 项目中使用 unplugin-auto-import 插件来自动导入 Element Plus 的图标，可以按照以下步骤进行操作：

1. 确保已经安装了 Element Plus 和 unplugin-auto-import 插件：

npm install element-plus unplugin-auto-import --save

2. 在 src/main.js 文件中导入 Element Plus 和 unplugin-auto-import 插件，并配置：

import { createApp } from 'vue';
import ElementPlus from 'element-plus';
import 'element-plus/lib/theme-chalk/index.css';

import AutoImport from 'unplugin-auto-import/vue';

import { Icon } from '@element-plus/icons';

import App from './App.vue';

createApp(App)
  .use(ElementPlus)
  .use(AutoImport, {
    imports: [
      {
        from: '@element-plus/icons',
        imports: [Icon],
      },
    ],
  })
  .mount('#app');

3. 在需要使用图标的组件中，可以直接使用 Element Plus 的图标，无需额外导入：

<template>
  <div>
    <el-button type='primary'>
      <icon-plus />
      Button
    </el-button>
  </div>
</template>

<script>
export default {
  name: 'MyComponent',
};
</script>

这样就可以在 Vue3 项目中使用 unplugin-auto-import 插件自动导入 Element Plus 的图标了。