0

我想将我们公司购买了许可证的 Font Awesome Pro 6 集成到我们的 Angular 项目中。

我的老板给了我 zip 发行版(不是 NPM 私有令牌,需要更新),我想升级@fortawesome/angular-fontawesome以使用专业版。

到目前为止,我们一直在使用免费版本的 FA 以及@fortawesome/free-solid-svg-icons. 特别是,这个库声明了在转译期间使用的 Typescript 符号。

在我拥有(package.json)之前

    "@fortawesome/angular-fontawesome": "^0.9.0",
    "@fortawesome/fontawesome-svg-core": "^1.2.36",
    "@fortawesome/free-brands-svg-icons": "^5.15.4",
    "@fortawesome/free-regular-svg-icons": "^5.15.4",
    "@fortawesome/free-solid-svg-icons": "^5.15.4",

问题:给定 FA Pro 6 的 zip 文件,其中包含以下内容

压缩文件

如何将字体集成到 Angular 项目中?

到目前为止我尝试过的

我已尝试将 FA 6 Pro 目录解压缩到src/font-awesome-pro中,并从中删除最后 4 个包(上面列出)package.json

我还希望angular.json手动修改添加 scss 和 js

            "scripts": [
              ...
              "./src/font-awesome-pro/js/fontawesome.js",
              ...
            ]
            "styles": [
              ...
              "./src/font-awesome-pro/scss/fontawesome.scss",
              "./src/styles.scss"

但我的应用程序无法编译

Error: src/app/shared/shared-components/spinner-block/spinner-block.component.ts:5:41 - error TS2307: Cannot find module '@fortawesome/free-solid-svg-icons' or its corresponding type declarations.

5 import {faSpinner, IconDefinition} from '@fortawesome/free-solid-svg-icons';
                                          ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

export class AmlcFontAwesomeModule {
  constructor(library: FaIconLibrary, faConfig: FaConfig) {
    // Add an icon to the library for convenient access in other components
    library.addIconPacks(far, fas, fab);
    library.addIcons(fa.faPencilAlt, fa.faRecycle, fa.faTrash, fa.faUser, fa.faLock, fa.faHome);
    faConfig.fixedWidth = true;
  }
}
4

1 回答 1

1

我认为该网站上的可下载资产不适用于该angular-fontawesome库。它们旨在以经典的 HTML 方式使用。

首先,我会尝试说服你的老板给你令牌。除非有人单击网站上的“重新生成”按钮,否则我认为它实际上不会改变。如果不可能,我认为您有两种选择:

  1. 您应该能够下载/安装图标包,fontawesome-svg-core并将npm.fontawesome.com它们提交到存储库,而不是每次都安装它们。为此,您将需要令牌,但如果将来重新生成令牌,应用程序不会中断。

  2. 切换angular-fontawesome到 vanilla Font Awesome 发行版。这不是推荐的方式,但它应该适用于<i>由您在存档中拥有的 vanilla Font Awesome JS 代码替换的标签。

也链接这个问题,因为它有类似的讨论。

于 2021-11-23T15:16:08.947 回答