Problems with the PRO version

[wonaGuillermo]

I bought the PRO version of Fontawesome and I am developing a project with Angular. My problem is that I did everything I found in the documentation but I can only use the free icons.

I am using Angular 16.1.5, in my dependencies I have:

"dependencies": {
    "@angular/animations":"^16.1.5",
    "@angular/cdk": "16.2",
    "@angular/common":"^16.1.5",
    "@angular/compiler":"^16.1.5",
    "@angular/core": "^16.1.5",
    "@angular/forms":"^16.1.5",
    "@angular/platform-browser":"^16.1.5",
    "@angular/platform-browser-dynamic": "^16.1.5",
    "@angular/router":"^16.1.5",
    "@angular/service-worker": "^16.1.5",
    "@awesome.me/kit-XXXXXXXXXXXXXXX":"^1.0.22",
    "@fortawesome/angular-fontawesome": "^0.13.0",
    "@fortawesome/fontawesome/fontawesome-pro": "^6.5.1",
    "@fortawesome/fontawesome/fontawesome-svg-core": "^6.4.0",
    "@fortawesome/free-brands-svg-icons": "^6.4.0",
    "@fortawesome/free-regular-svg-icons": "^6.4.0",
    "@fortawesome/free-solid-svg-icons": "^6.4.0",
    "@fortawesome/pro-light-svg-icons": "^6.4.0",
    "@fortawesome/pro-regular-svg-icons": "^6.4.0",
    "@fortawesome/pro-solid-svg-icons":"^6.4.0",
}

In my module I import the free icons but I can't import the PRO icons.

import { FontAwesomeModule, FaIconLibrary } from '@fortawesome/angular-fontawesome';
import { fas } from '@fortawesome/free-solid-svg-icons';
import { fab } from '@fortawesome/free-brands-svg-icons';
import { far } from '@fortawesome/free-regular-svg-icons';

export class SharedModule {
  constructor(library: FaIconLibrary) {
    library.addIconPacks(fab, far, fas);
  }
}

This is because the PRO icons are exported with the same names and even if I change the free ones for the PRO ones I get an error when trying to compile, it doesn't recognize the 'fas' from @fortawesome/pro-solid-svg-icons, what am I doing wrong? There are not many examples of using PRO icons. I can't add @fortawesome/pro-light-svg-icons and @fortawesome/pro-regular-svg-icons either.

I followed the steps on the "Use Your Kit with a Package Manager" page. And I have my .npmrc file created with my information

@awesome.me:registry=https://npm.fontawesome.com/
@fortawesome:registry=https://npm.fontawesome.com/
//npm.fontawesome.com/:_authToken=XXXXXXXXXXXXXXXXXXX

Are the kits not usable with @fortawesome/angular-fontawesome 0.13.0? or with any version?

I would appreciate your help.

[devoto13]

There is currently an issue with Kits - #423.

Pro packages, like @fortawesome/pro-solid-svg-icons you should be able to use without issues. If it does not work, please create a minimal reproduction of a problem and push it to the GitHub repo, so I can take a look. To create a minimal reproduction, you can generate a new project using ng new and then add a minimal code which produces the error. Don't include your authToken in the .npmrc though.

[wonaGuillermo]

If there are problems with the kits then what should be the steps to follow, create the .npmrc file and then install angular-fontawesome? The problem is that if you use the free icons and the PRO icons as I import all of them with

constructor(library: FaIconLibrary) {
    library.addIconPacks(fab, far, fas);
}

In the same module?

[devoto13]

Pro icon packages include all free icons too, so you don't need to import both Pro and Free. It's enough to import only Pro to get all icons.

[wonaGuillermo]

So as the kits don't work I just create the .npmrc file and add the library with ng add @fortawesome/angular-fontawesome@ importing in my project the PRO icons? or are there more steps?

[devoto13]

Those steps should be sufficient.

[wonaGuillermo]

Finally I managed to make the PRO icons work with the Angular library for Fontawesome, I leave a commentary of how I did it in case it is helpful for anyone:

1- Create the .nmprc file with the data they give you in the Fontawesome panel to use the token.

2- Install the version of the library for your version of Angular and choose the PRO and Free icons for the Brands.

3- Import into the module as usual.

I think the problem was because I tried to use the kits and installed other libraries that were requested in the documentation.