vue中引入icomoon彩色图标,stylus文件
- 在iconmoon中preferences选择Stylus。
- 点击download,解压后有以下文件。
- 将fonts文件夹复制到src目录下common中。并在common目录中添加stylus文件夹。将style.styl文件和variables.styl文件复制进去。(可将style.styl改为icon.styl)我的项目目录如下:
- 更改variables.styl中icomoon-font-path ?= “…/fonts” 路径为fonts所在的路径。
- 在main.js中引入import “./common/stylus/icon.styl”;
- 完成后在项目中引用图标。
<template>
<div id="app">
<div>
<span class="icon-bili">
<span class="path1"></span>
<span class="path2"></span>
</span>
<span>icon-bili</span>
</div>
</div>
</template>
<style lang="stylus">
</style>
- 结果如下: