NullInjectorError: FaConfig没有提供程序

Question

NullInjectorError: FaConfig没有提供程序

6

我使用npm像github上提到的那样，在angular应用程序中安装了angular-fontawesome。

在开发模式下运行良好。但是在生成的构建中出现错误。

当然初始错误是：

NullInjectorError: StaticInjectorError(Do)[qm -> t]: StaticInjectorError(Platform: core)[qm -> t]: NullInjectorError: No provider for t!

需要在angular.json中更改设置：

"optimization": false,
...
"buildOptimizer": true,

查找实际错误

NullInjectorError: StaticInjectorError(AppModule)[FaIconComponent -> FaConfig]: StaticInjectorError(Platform: core)[FaIconComponent -> FaConfig]: NullInjectorError: No provider for FaConfig!

我该如何解决这个问题。

这个模块有

import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';

已添加到导入项

  @NgModule({
  declarations: [...],
  imports: [
    ...
    FontAwesomeModule
  ],

组件具有以下特点：

import { faEllipsisV, ... } from '@fortawesome/free-solid-svg-icons';

如在指南中提到的那样。

以下是依赖项。

  "dependencies": {
    "@angular/animations": "~8.2.11",
    "@angular/cdk": "~8.2.3",
    "@angular/common": "~8.2.11",
    "@angular/compiler": "~8.2.11",
    "@angular/core": "~8.2.11",
    "@angular/forms": "~8.2.11",
    "@angular/material": "^8.2.3",
    "@angular/platform-browser": "~8.2.11",
    "@angular/platform-browser-dynamic": "~8.2.11",
    "@angular/router": "~8.2.11",
    "@fortawesome/angular-fontawesome": "^0.6.0-alpha.0",
    "@fortawesome/fontawesome-svg-core": "^1.2.25",
    "@fortawesome/free-solid-svg-icons": "^5.11.2",
    "bootstrap": "^4.3.1",
    "classlist.js": "^1.1.20150312",
    "hammerjs": "^2.0.8",
    "ngx-bootstrap": "^5.2.0",
    "ngx-cookie-service": "^2.2.0",
    "ngx-webstorage-service": "^4.1.0",
    "rxjs": "~6.4.0",
    "tslib": "^1.10.0",
    "web-animations-js": "^2.3.2",
    "zone.js": "~0.9.1"
  }

Angular版本8.3.12。

- vipanth

仅仅导入一个类并不足够，需要再次阅读指南。您必须在NgModule装饰器的导入中添加FontAwesomeModule。 - JB Nizet

@JBNizet 抱歉，我没有提到，该模块是在_imports_中添加的。代码在开发环境下运行良好，但在--prod模式下失败。 - vipanth

你使用的是哪个版本的Angular？能否发布一下你的依赖项？ - Leandro

4个回答

1

因为更新版本的原因导致了这个错误，由于这个问题在0.6.0-alpha.0版本中仍然存在，请降级你的angular font-awesome库。

例如，使用以下命令指定正确的版本：

npm i @fortawesome/angular-fontawesome@0.5.0

注：在Angular8之前，它可以正常工作，因为我还没有在Angular8+上尝试过。

- Omkar Joshi

1

降级到0.5.0对我有用。

- Hassan

0

你需要导入fortawesome库，然后在其中添加实心图标。 https://www.npmjs.com/package/@fortawesome/fontawesome-svg-core

import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
import { library } from '@fortawesome/fontawesome-svg-core';
import { fas, faEllipsisV } from '@fortawesome/free-solid-svg-icons';

library.add(fas, faEllipsisV);

- AlleXyS

你要导入它们，是在模块还是组件中？ - vipanth

绝对在模块中。 - AlleXyS

我按照所说的尝试了。将library.add()添加到构造函数中。对于我使用的每个模块都这样做了。更进一步，我使用了 fas、far 的组合，但是没有用。错误仍然是相同的。 - vipanth

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Bart Verkoeijen · Accepted Answer

最新版本0.6.0-alpha.0存在问题，如果您没有指定版本，可能会自动安装该版本。

https://github.com/FortAwesome/angular-fontawesome/issues/210

您可以降级到0.5.0版本以解决此AOT构建错误：

npm i @fortawesome/angular-fontawesome@0.5.0