如何使用通过NPM安装的Awesome 5字体 [英] How to use font awesome 5 installed via NPM

问题描述

我没有找到下一步的文档，而是通过npm安装到我的项目中，

I am not finding any docs for what to do next, I installed into my project via npm,

$ npm install --save @fortawesome/fontawesome-free-webfonts

但是现在呢?谁能指出我现在如何实际导入或使用它? 谢谢.

But now what? Can anyone point me to how to actually import or use it now? Thank you.

推荐答案

首先使用 NPM 安装它:

npm install @fortawesome/fontawesome-free --save-dev

现在有两种方法，一种方法是将绝对 URL 嵌入到 HEAD 部分中，或者如果您使用的是 SASS(SCSS)，您可以像这样将其导入您的 custom.scss 文件中:

Now you have two ways, one way is to embed the absolute URL within your HEAD section or if you working with something like SASS(SCSS), You can import it in your custom.scss file like this :

1-首先为 webfonts 设置绝对路径(必须在fontawesome.scss之前设置):

1- first set an absolute path for webfonts (It has to be set before the fontawesome.scss) :

$fa-font-path: "node_modules/@fortawesome/fontawesome-free/WebFonts" !default;

2-然后导入 fontawesome.scss :

@import "node_modules/@fortawesome/fontawesome-free/scss/fontawesome";

3-最后导入常规，实心或浅色(专业版)的图标类型:

3- Finally import regular, solid or light(pro version) of icon types :

@import "node_modules/@fortawesome/fontawesome-free/scss/regular";

毕竟，您可以为这些类分配 font-family :

After all you can assign font-family to these classes to work :

.fa,.fas,.far,.fal,.fab {
  font-family: "Font Awesome 5 Free";
}

这篇关于如何使用通过NPM安装的Awesome 5字体的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！