electron-vue项目笔记5——font-awesome字体包

2,433 阅读1分钟

项目中使用font-awesome字体包有两种方式:

  • npm安装 字体包然后导入到主进程,然后在main.js中引用css
  • 官网 下载zip 解压后复制到static目录,然后在main.js中引用css

官网:fontawesome

推荐网站:


我采用方案1:

方案1:npm安装

  1. npm安装字体包
npm install font-awesome --save

  1. 在主进程main.js中引用css
 import 'font-awesome/css/font-awesome.min.css'

  1. 在vue页面测试
<i class="fa fa-address-book"></i>

可以看到字体图标已经成功应用

方案2:下载zip

1.下载font-awesome-4.7.0字体包

  1. 解压字体包

  1. 复制解压后的font-awesome-4.7.0文件夹到项目的static目录

  1. 在主进程main.js中引用css
import '../../static/font-awesome-4.7.0/css/font-awesome.min.css'

  1. 在vue页面测试
<i class="fa fa-address-book"></i>

可以看到字体图标已经成功应用