5.Vue3加载Element-plus的字体图标

字体图标与其他不一样需要额外安装

安装字体图标

npm install @element-plus/icons-vue

import * as components from '@element-plus/icons-vue'
export default{
    install:(app)=>{
        for(const key in components) {
            const componentConfig = components[key];
            app.component(componentConfig.name, componentConfig)
        }
    }
}

引入文件

在main.js中引入icons.js文件

import elementIcon from './plugins/icons'
app.use(elementIcon)

使用方式

接下来可以直接在任意组件中引用

<el-icon class="is-loading" color="red" :size="50">
    <Loading />
  </el-icon>