Integrating Font Awesome Pro (zip distribution) with Angular-CodePudding

I want to integrate Font Awesome Pro 6, of which our company bought a license, into our Angular project(s).

My boss gave me the zip distribution (not the NPM private token, which is subject to renewal), and I would like to upgrade

How do I integrate the fonts into Angular projects?

What I have tried so far

I have tried to unzip the FA 6 Pro directory into src/font-awesome-pro, and delete the 4 last packages (listed above) from package.json.

I also expected to amend angular.json adding the scss and js manually

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

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

But my application won't compile

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';
                                          ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Also

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;
  }
}

CodePudding user response：

I don't think the downloadable assets from the website will work with the angular-fontawesome library. They are designed to be used in the classic HTML way.

First I would try to convince your boss to give you the token. I don't think it actually changes unless somebody clicks Regenerate button on the website. If not possible, I think you have two options:

You should be able to download/install the icon packages and fontawesome-svg-core from npm.fontawesome.com and commit them to the repository instead of installing them every time. You will need the token for that, but the app won't break if the token is regenerated in the future.
Switch from angular-fontawesome to the vanilla Font Awesome distribution. That's not the recommended way, but it should work with <i> tags being replaced by the vanilla Font Awesome JS code you have in the archive you've got.

Also linking this issue as it had similar discussion.