怎么在vue3项目中引入element-plus的Icon

vue3中引入element-plus的Icon

最近使用element-plus开发项目，发现element-plus废弃了Font Icon 使用了 SVG Icon。需要在全局注册组件，或者按需引用。

安装#

使用包管理器#

选择一个你喜欢的包管理器

NPM

$ npm install @element-plus/icons-vue

Yarn

$ yarn add @element-plus/icons-vue

pnpm

$ pnpm install @element-plus/icons-vue

全局引用

**在main里面导入引入icon**

import \* as Icons from '@element-plus/icons-vue'

**// 注册Icons 全局组件**

Object.keys(Icons).forEach(key => {

  app.component(key, Icons[key])

})

按需引用

**（House ）名字引用是你要使用图标的名字，导入是首字母大写**

import { House } from '@element-plus/icons-vue'

// 在vue文件使用

 <el-icon><house /></el-icon>

我正在参与2023腾讯技术创作特训营第三期有奖征文，组队打卡瓜分大奖！