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 模板的新 ...
随机推荐
- SpringCloud学习笔记《---03 Ribbon Rule---》核心篇
- Idea 2018.2.5创建springboot项目依赖包没有的错误
- 拦截器(Interceptor)与过滤器(Filter)的区别
转自:https://www.jianshu.com/p/cf088baa9b04 过滤器,是在java web中将你传入的request.response提前过滤掉一些信息,或者提前设置一些参数.然 ...
- html选择器[获取兄弟(同级元素)]
1.html <div class="col-md-5"> <h4 class="m-t-md" id="dwzh"> ...
- LUOGU P2949 [USACO09OPEN]工作调度Work Scheduling (贪心)
解题思路 明明一道比较简单的贪心结果挂了好几次23333,就是按照时间排序,然后拿一个小根堆维护放进去的,如果时间允许就入队并且记录答案.如果不允许就从堆里拿一个最小的比较. #include< ...
- form表单简易注册登陆
注册页面: html <form action="updata.php" method="post" id="text_form"&g ...
- webpack新手名词解释……妈妈再也不担心我看不懂webpack官方文档了
__dirname : 在任何模块文件内部,可以使用__dirname变量获取当前模块文件所在目录的完整绝对路径. path.resolve(): 方法将一系列路径或路径段解析为绝对路径. 语法: p ...
- linux 编译安装php选项
PHP安装 ./configure --prefix=/usr/local/php --with-config-file-path=/usr/local/php/etc --with-mysql=/u ...
- CPU的load和使用率傻傻分不清(转)
转自: https://www.cnblogs.com/yunxizhujing/p/9382396.html 1. 什么是Cpu的Load 使用uptime.top或者查看/proc/loadavg ...
- 小米手机的miui10 连接电脑。本地播放器推荐。
问题: 电脑连接了手机却不能看到手机里面的文件. 方法一 方法二 连接和电脑一样的wifi 进入文件管理 来自:百度经验. 本地播放器推荐 爱奇艺万能播放器(还不错,目前在用).qq影音 爱奇艺万能播 ...