当前位置:   article > 正文

Vue引入字节跳动图标库_iconpark vue next

iconpark vue next

 复制下面的命令安装IconPark库:

npm install @icon-park/vue-next --save

如果你不在乎打包大小,可以全局注册IconPark并使用。在你的main.js中配置如下代码:

  1. import { createApp } from "vue";
  2. import App from "./App.vue";
  3. const app = createApp(App);
  4. //权限
  5. import "@/utils/permission";
  6. //路由
  7. import router from "./router";
  8. app.use(router);
  9. //字节跳动图标库
  10. import {install} from '@icon-park/vue-next/es/all';
  11. install(app);
  12. //挂载
  13. app.mount("#app");

打开IconPark官方网站:ByteDance IconPark

找到你要使用的图标,比如这个:like

    使用【component 标签的 is 属性】动态引入图标

  1. <el-icon>
  2. <component theme="outline" size="24" :is="'icon-home'" />
  3. </el-icon>

原创作者:吴小糖 

创作时间:2023.12.13

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/Gausst松鼠会/article/detail/696606
推荐阅读
相关标签
  

闽ICP备14008679号