如何使用通过 NPM 安装的 font Awesome 5

2024-01-20

我没有找到任何下一步该做什么的文档,我通过以下方式将 font-awesome 安装到了我的项目中npm:

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

但现在怎么办?
谁能指出我现在如何实际导入或使用它?


首先使用安装它NPM :

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

现在你有两种方法,一种方法是嵌入绝对值URL在你的HEAD部分或者如果您正在使用类似的东西SASS(SCSS),您可以将其导入到您的自定义.scss像这样的文件:

  1. 首先设置绝对路径webfonts(必须在之前设置字体真棒.scss) :
    $fa-font-path: "node_modules/@fortawesome/fontawesome-free/WebFonts" !default;
    
  2. 然后导入字体真棒.scss :
    @import "node_modules/@fortawesome/fontawesome-free/scss/fontawesome";
    
  3. 最后导入常规、实心或浅色(专业版)图标类型:
    @import "node_modules/@fortawesome/fontawesome-free/scss/regular";
    

毕竟你可以分配字体系列到这些班级工作:

.fa,.fas,.far,.fal,.fab {
    font-family: "Font Awesome 5 Free";
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何使用通过 NPM 安装的 font Awesome 5 的相关文章

随机推荐

  • 在 sbt 0.13 中使用 .sbt 文件编写多项目构建的惯用方法

    我听说 sbt 文件在 0 13 中以各种方式得到了改进 现在我可以在其中指定多项目构建 http www scala sbt org 0 13 0 docs Community ChangeSummary 0 13 0 html sbt
  • Flutter - 如何在颤振中的数字键盘中添加完成按钮

    我正在尝试添加done数字类型输入中的按钮TextFormField颤抖但我无法做到这一点 TextFormField key Key keyValue initialValue valueBuilder onSaved text fiel
  • 创建 tar 存档时添加目录

    我想压缩一些文件 和目录 但想创建一个这些文件应驻留在其中的附加目录 例如对于以下目录结构 myproject file1 file2 subdir1 file3 我 cd 进入myproject目录并想要创建 tar 存档 tar czf
  • 有支持 PHP 5.3 的 PHPDocumentor 替代品吗?

    一些新的 PHP 5 3 功能 包括命名空间和匿名函数 与 PHPDocumentor 不兼容 即使是最新版本也是如此 例如 当遇到 没有名称的函数 即闭包 时 它只会引发错误 那么 是否有其他开源工具可以根据 PHP 5 3 代码中的 J
  • 清除 HTML 标签中的所有内联事件

    对于 HTML 输入 我想中和所有具有内联 js 的 HTML 元素 onclick onmouseout 等 我在想 对下面的字符进行编码还不够吗 所以 onclick location href ggg com 会变成 onclick
  • cmake 上的相对路径/如果之后更改路径,则会出现错误

    我有一个带有自己项目的 VS 12 解决方案 该解决方案依赖于一些依赖项 使用 cmake 生成的项目文件 我使用 cmake 生成了这些 VS12 项目 并将这些项目添加到我的解决方案中 使用相对路径 然后我必须调整这些项目的输出目录 在
  • CentOS 上 PHP 7 的 Memcache 扩展安装失败

    我正在尝试将相当大的 PHP 5 3 代码库升级到 PHP 7 它托管在 CentOS 6 5 上 因此我想将其保留在该操作系统上 我目前正在一个原始 Vagrant 机器上进行此操作 我已成功安装 PHP 7 以及除 Memcache 之
  • 使用 Angular-map 包将 Bingmap 集成到 Angular 6 中

    我正在尝试使用 angular map npm 包在 Angular 6 中实现 bingmap 因为我有refer https www npmjs com package angular maps also referred https
  • 对数字音频进行下采样并应用低通滤波器

    我从 CD 中获得了 44Khz 音频流 表示为 16 位 PCM 样本数组 我想将其削减至 11KHz 流 我怎么做 从多年前我上工程课时起 我就知道流将无法再准确地描述超过 5500Hz 的任何内容 因此我想我也想删除高于此的所有内容
  • Twitter Bootstrap 2:导航栏子菜单链接不起作用

    更新到 Twitter Bootstrap 2 0 非常棒 后 导航链接inside子菜单不起作用 jQuery 版本为 1 7 1 下拉菜单实际上有效 并且标记是正确的 根据文档 div class navbar navbar fixed
  • 如何在VS2010 RDLC报表中添加组页脚

    如何将 组页脚 摘要行添加到我在 VS2010 RLDC 中创建的组中 设计器的底部有行组和列组 单击行组旁边的箭头 然后单击 添加总计 这会添加页脚行 但请注意 如果您在最外面的组上执行此操作 它会添加一个 报告页脚 显示所有组的总计 而
  • 如何使用 scipy.optimize.minimize 进行最大似然回归

    我如何使用最大似然回归scipy optimize minimize 我特别想使用minimize在这里运行 因为我有一个复杂的模型 需要添加一些约束 我目前正在尝试使用以下内容的简单示例 from scipy optimize impor
  • 如果没有 verifyProof、sessionInfo、临时证明或注册 ID,则无法创建 PhoneAuthCredential

    我正在尝试firebase电话验证 在我的电话号码上收到代码后 代码跳转到verifysignincode 方法 创建失败phoneAuthCredentials 程序捕获的异常是 无法创建PhoneAuthCredential没有任何一个
  • 在 Symfony 2 中验证没有形式的实体

    我正在为 Symfony 2 创建一个 REST API 控制器 我开始使用 SensioGeneratorBundle 创建 CRUD 并修改该控制器以充当 REST 控制器 但是 我没有表格 所以我正在考虑删除这部分 如何在没有表单的情
  • 我可以在打字稿中检查联合类型的类型吗?

    有没有一种方法可以针对语言中内置的联合类型对对象进行类似 instanceof 的查询 我有一个带有联合类型的类型别名 如下所示 type MyType Foo Bar Thing Each of Foo Bar and Thing继承自B
  • desiredAccuracy 和 distanceFilter 之间的区别

    很抱歉在这里成为菜鸟 我无法清楚地区分 CLLocationManager 属性距离过滤器 and 期望准确度 如果我希望我的应用程序为即使很小的距离 例如 100 200 米 提供不同的坐标 我应该为这些属性设置什么值 帮助将不胜感激 根
  • Homebrew 说 Xcode 已经过时了

    我正在尝试使用 Homebrew 执行软件包的安装 但是当我尝试运行安装时出现以下错误 错误 您的 Xcode 7 3 1 已过时 请更新到 Xcode 8 0 或删除它 Xcode 可以从 App Store 更新 我想在这台机器上保留
  • 更改 UISearchBar 放大图标颜色和位置

    我有一个 UISearchBar 我想更改初始放大图标 出现在 UISearchBar 中间的图标 的位置以及颜色或图标 到目前为止 我更改了色调和图标图像 但是 只有当我在模拟器上测试应用程序时才会显示新图标 但在实际设备 均运行 iOS
  • 具有索引签名的 keyof 类型运算符

    我正在阅读打字稿docs https www typescriptlang org docs handbook 2 keyof types html the keyof type operator并通过这段代码摘录得出 type Mapis
  • 如何使用通过 NPM 安装的 font Awesome 5

    我没有找到任何下一步该做什么的文档 我通过以下方式将 font awesome 安装到了我的项目中npm npm install save fortawesome fontawesome free webfonts 但现在怎么办 谁能指出我