vue 安装 fontawesome
查看最新版的fontawesome 信息: https://github.com/FortAwesome/vue-fontawesome
搜索图标 :https://fontawesome.com/icons?d=gallery
安装:
//安装核心文件
$ cnpm i --save @fortawesome/fontawesome-svg-core
$ cnpm i --save @fortawesome/free-solid-svg-icons
$ cnpm i --save @fortawesome/vue-fontawesome //安装更多样式的图标文件,这里安装的是免费版的,收费版的到上面的地址查看 $ cnpm i --save @fortawesome/free-brands-svg-icons
$ cnpm i --save @fortawesome/free-regular-svg-icons
引入:
//main.js
import { library } from '@fortawesome/fontawesome-svg-core'
import { faCoffee } from '@fortawesome/free-solid-svg-icons'
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome' library.add(faCoffee) Vue.component('font-awesome-icon', FontAwesomeIcon)
在页面组件中使用:
//icon里的就是图标的名字
<template>
<div id="app">
<font-awesome-icon icon="coffee" />
</div>
</template>
vue 安装 fontawesome的更多相关文章
- VUE.之安装 font-awesome
VUE.之安装 font-awesome 我们在项目中经常使用各种图标:font-awesome (http://fontawesome.dashgame.com/) 1.npm 安装font-awe ...
- vue 使用font-awesome
1.npm 安装font-awesome 以及需要的所有依赖 npm i --save @fortawesome/fontawesome-svg-core npm i --save @fortawes ...
- [Vue安装教程]十分钟学会vue 安装
Vue的安装主要有一下几个步骤: 1.安装npm淘宝镜像 npm install -g cnpm --registry=https://registry.npm.taobao.org 2.安装脚手架工 ...
- 前端笔记之Vue(一)初识SPA和Vue&webpack配置和vue安装&指令
一.单页面应用(SPA) 1.1 C/S到B/S页面架构的转变 C/S:客户端/服务器(Client/Server)架构的软件. C/S 软件的特点: ① 从window桌面双击打开 ② 更新的时候会 ...
- vue安装搭建
title: vue安装搭建 date: 2018-04-21 14:00:03 tags: [vue] --- 安装 首先安装nodejs 直接官网下载最新版本http://nodejs.cn/do ...
- vue安装及环境搭建
vue项目在pycharm里运行需要安装一个插件,打开settings,找到plugins,里面搜索vue.js,点击安装. vue安装 先安装node.js npm install -g @vue/ ...
- Vue系列(2):Vue 安装
前言:关于页面上的知识点,如有侵权,请看 这里 . 关键词:小白.Vue 安装.Vue目录结构.Vue 构建页面流程 ? 初学者安装 vue 用什么好 大家都知道,学 Vue 最好还是去官网学,官网写 ...
- vue 安装与起步
vue安装: 1.官网下载vue,在script标签里引用(去下载) 2.使用CDN(建议下载到本地,不推荐这种方法): BootCDN:https://cdn.bootcss.com/vue/2.2 ...
- Vue安装及插件Vue Devtools
vue安装: # 最新稳定版 $ npm install vue # 全局安装 vue-cli $ npm install --global vue-cli # 创建一个基于 webpack 模板的新 ...
随机推荐
- Nand flash 芯片工作原理
Nand flash 芯片型号为 Samsung K9F1208U0B,数据存储容量为 64MB,采用块页式存储管理.8 个 I/O 引脚充当数据.地址.命令的复用端口. 芯片内部存储布局及存储操作特 ...
- EasyNetQ异常处理
代码下载 https://download.csdn.net/download/u010312811/11252093 官方Demo https://github.com/EasyNetQ/EasyN ...
- Luogu P2079 烛光晚餐(背包)
P2079 烛光晚餐 题意 题目背景 小明准备请小红去一家咖啡厅,共进烛光晚餐.小红高兴地和他一起去了咖啡厅. 题目描述 小红说:"小明,你点菜吧."小明看到菜单上有\(N\)道菜 ...
- 安卓中 使用html来使文字变色Html.fromHtml
在这里 我是用的html使文字的个别颜色变红 String textStr = " 本课程为<font color=\"#FF0000\">" + ...
- 二分图匹配——poj1469
关于本题二分图的匹配关系始终是加单向边用左边去匹配右边,match表示的是右边的人匹配的对应的左边的点 /* 关于本题二分图的匹配 链接的关系始终是单向边 用左边去匹配右边,match表示的是右边的人 ...
- 菜鸟nginx源码剖析数据结构篇(三) 单向链表 ngx_list_t[转]
菜鸟nginx源码剖析数据结构篇(三) 单向链表 ngx_list_t Author:Echo Chen(陈斌) Email:chenb19870707@gmail.com Blog:Blog.csd ...
- 利用R语言制作出漂亮的交互数据可视化
利用R语言制作出漂亮的交互数据可视化 利用R语言也可以制作出漂亮的交互数据可视化,下面和大家分享一些常用的交互可视化的R包. rCharts包 说起R语言的交互包,第一个想到的应该就是rCharts包 ...
- PAT甲级——A1068 Find More Coins
Eva loves to collect coins from all over the universe, including some other planets like Mars. One d ...
- AppScan的基础使用
AppScan是用于Web项目的安全测试工具,扫描网站所有url,自动测试是否存在各种类型的漏洞.AppScan安装在Windows环境上,版本越高,规则库越安全,扫描越全面. 1. 打开AppS ...
- iotop实时监控磁盘io
介绍 Linux下的IO统计工具如iostat, nmon等大多数是只能统计到per设备的读写情况, 如果你想知道每个进程是如何使用IO的就比较麻烦. iotop 是一个用来监视磁盘 I/O 使用状况 ...