javascript – 使用npm为scss使用安装字体awesome 5

前端之家收集整理的这篇文章主要介绍了javascript – 使用npm为scss使用安装字体awesome 5前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
就像标题所说的那样,我无法使用npm安装字体awesome 5用于scss目的.

尝试安装第5版

适应https://fontawesome.com/how-to-use/use-with-node-js

npm i –save @ fortawesome / fontawesome

查看node_modules中的安装,我看不到要连接的scss文件.我尝试在我的app.scss文件中包含styles.css文件,但这不起作用.

我的版本4的设置:

的package.json
“font-awesome”:“^ 4.7.0”,

app.scss
@import“node_modules / font-awesome / scss / font-awesome.scss”;

用法
< i className =“fa fa-save icon controlItem”>< / i>

非常简单.我如何用版本5实现这一点?我使用了错误的包装吗?

UPDATE

显然,只使用@ fortawesome / fontawesome并不是真的.这些包已被拆分,因此您还必须选择
npm install –save @ fortawesome / fontawesome-free-regular

我仍然没有成功导入它

解决方法

npm install --save-dev @fortawesome/fontawesome
npm install --save-dev @fortawesome/fontawesome-free-regular
npm install --save-dev @fortawesome/fontawesome-free-solid
npm install --save-dev @fortawesome/fontawesome-free-brands

在你的app.js或同等的Javascript文件中,

import fontawesome from '@fortawesome/fontawesome'
import regular from '@fortawesome/fontawesome-free-regular'
import solid from '@fortawesome/fontawesome-free-solid'
import brands from '@fortawesome/fontawesome-free-brands'

fontawesome.library.add(regular)
fontawesome.library.add(solid)
fontawesome.library.add(brands)

对于使用,类名的使用方式略有变化.请参阅Fontawesome网站上的图标以获取“完整”类名称.

<i class="fas fa-chevron-left"></i>

虽然将所有3种字体添加到项目中的想法似乎是一件很方便的事情,但要注意这会在构建/编译项目时降低性能.因此,强烈建议您添加所需的字体而不是所有字体.

猜你在找的JavaScript相关文章