本文主要是介绍Vue引入字节跳动图标库,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
复制下面的命令安装IconPark库:
npm install @icon-park/vue-next --save
如果你不在乎打包大小,可以全局注册IconPark并使用。在你的main.js
中配置如下代码:
import { createApp } from "vue";import App from "./App.vue";
const app = createApp(App);//权限
import "@/utils/permission";//路由
import router from "./router";
app.use(router);//字节跳动图标库
import {install} from '@icon-park/vue-next/es/all';
install(app);//挂载
app.mount("#app");
打开IconPark官方网站:ByteDance IconPark
找到你要使用的图标,比如这个:like
使用【component 标签的 is 属性】动态引入图标
<el-icon><component theme="outline" size="24" :is="'icon-home'" /></el-icon>
原创作者:吴小糖
创作时间:2023.12.13
这篇关于Vue引入字节跳动图标库的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!