Vue 项目 iconfont 配置

目录

• 下载
• 项目中添加css文件
• 项目中引用

下载

iconfont官网 -> 我的项目 -> 下载至本地 -> 解压 -> 得到 iconfont.css 文件

项目中添加css文件

• 将 iconfont.css 拷贝到项目目录中，放css文件的目录下
• 打开编辑 iconfont.css ，将 .iconfont{} 后面所有的内容删除
• 将本地字体文件替换为线上字体
  1. 复制线上链接。iconfont官网 -> 我的项目 -> 查看线上链接 -> 点此复制代码
  2. 替换线上链接，编辑 iconfont.css ，替换 @font-face { ... } 相关内容

项目中引用

• 导入

// main.js
import './style/iconfont.css'

• 使用

<div class="iconfont">&#xe600;</div>