element-plus Icon图标统一导入及注册

element-plus官方提示，Icon图标正在向SVG Icon迁移，之前使用的Font Icon
即将被弃用。

1. 安装

   $ yarn add @element-plus/icons
   # 或者
   $ npm install @element-plus/icons

2. 基础使用

   在需要加载图标的页面内按需引入所需图标。（ps:这里官方文档并没有详细说明）

---

3. 统一导入并注册

   //main.ts文件
   import * as ElIconModules from '@element-plus/icons'
   
   const app = createApp(App)
   // 统一注册Icon图标
   for (const iconName in ElIconModules) {
     if (Reflect.has(ElIconModules, iconName)) {
       const item = ElIconModules[iconName]
       app.component(iconName, item)
     }
   }

   ps:使用ts，当数组下标为字符串时，会报错。
   
   解决方法：在tsconfig.json内添加如下规则：

   "suppressImplicitAnyIndexErrors": true

4. 在组件中直接使用
   
   点击图标，复制相应的icon，粘贴到要加载的位置，直接使用。

5. 动态使用
   例如：想要在el-menu组件中动态使用Icon图标，使用动态组件即可实现。

   // router.js
   const routes = [
     {
       path: '/dashboard',
       component: Layout,
       meta: {
         title: '首页',
         icon: 'HomeFilled'
       },
       children: []
     }
   ]

   // MenuItem.vue