未捕获的错误：fa-icon/fa-duotone-icon 组件需要属性图标在 http://localhost:9876/_karma_webpack_/polyfills.js:23598:29

如何解决未捕获的错误：fa-icon/fa-duotone-icon 组件需要属性图标在 http://localhost:9876/_karma_webpack_/polyfills.js:23598:29

我正在项目中运行我的测试用例。执行测试用例时，我面临以下错误。虽然它们没有破坏我的测试用例，但仍然在控制台中打印了大量日志。

我正在开发 Angular v11。

Chrome 88.0.4298.0 (Windows 10) ERROR
Uncaught Error: Property icon is required for fa-icon/fa-duotone-icon components.
at http://localhost:9876/_karma_webpack_/polyfills.js:23598:29

Error: Property icon is required for fa-icon/fa-duotone-icon components.
at faWarnIfIconSpecMissing (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@fortawesome/angular-fontawesome/__ivy_ngcc__/fesm2015/angular-fontawesome.js:97:1)
at FaIconComponent.ngOnChanges (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@fortawesome/angular-fontawesome/__ivy_ngcc__/fesm2015/angular-fontawesome.js:234:1)
at FaIconComponent.rememberChangeHistoryAndInvokeOnChangesHook (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:1520:1)
at callHook (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:2583:1)
at callHooks (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:2542:1)
at executeInitAndCheckHooks (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:2493:1)
at refreshView (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:9481:1)
at refreshEmbeddedViews (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:10591:1)
at refreshView (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:9490:1)
at refreshEmbeddedViews (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:10591:1)

应用模块

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

**events.component.ts**

    import { faSearch,faSpinner,faCaretDown,faSync } from '@fortawesome/free-solid-svg-icons';

    // Font Awesome Icons
    public faSearch = faSearch;
    public faSpinner = faSpinner;
    public faCaretDown = faCaretDown;
    public farefresh = faSync;

events.component.html

    <fa-icon *ngIf="searching.searchText" [icon]="faSearch"></fa-icon>

Package.json

    "dependencies": {
        "@angular/animations": "11.2.10","@angular/common": "11.2.10","@angular/compiler": "11.2.10","@angular/core": "11.2.10","@angular/forms": "11.2.10","@angular/platform-browser": "11.2.10","@angular/platform-browser-dynamic": "11.2.10","@angular/router": "11.2.10","@fortawesome/angular-fontawesome": "0.8.2","@fortawesome/fontawesome-common-types": "0.2.35","@fortawesome/fontawesome-svg-core": "1.2.35","@fortawesome/free-brands-svg-icons": "5.15.3","@fortawesome/free-regular-svg-icons": "5.15.3","@fortawesome/free-solid-svg-icons": "5.15.3","@ng-select/ng-option-highlight": "0.0.6","@ng-select/ng-select": "6.1.0","@ngx-translate/core": "12.1.2","@ngx-translate/http-loader": "4.0.0","angular2-uuid": "1.1.1","animate.css": "3.7.2","asn1js": "2.0.26","bootstrap": "3.4.1","bootstrap-vertical-tabs": "1.2.2","chart.js": "2.9.4","core-js": "3.11.1","deep-object-diff": "1.1.0","dragula": "3.7.2","ejs": "3.0.2","font-awesome": "4.7.0","http-errors": "1.7.3","http-status-codes": "1.4.0","ipaddr.js": "1.9.1","jquery": "3.5.1","lodash": "4.17.20","moment": "2.24.0","moment-timezone": "0.5.28","ng-busy": "11.0.0","ng2-charts": "2.3.0","ng2-dragula": "2.1.1","ng2-tree": "2.0.0-rc.11","ngx-bootstrap": "5.6.1","ngx-clipboard": "12.3.1","ngx-ui-switch": "6.0.3","number-abbreviate": "2.0.0","pkijs": "2.1.88","postcss": "8.2.13","postcss-url": "8.0.0","pvutils": "1.0.17","reflect-Metadata": "0.1.13","rxjs": "6.6.3","rxjs-compat": "6.5.5","sta-interface": "file:../common/sta-interface","sta-mock": "file:../common/sta-mock","tslib": "1.10.0","typeahead.js": "0.11.1","uuid": "3.4.0","validator": "13.0.0","version": "0.1.2","zone.js": "0.10.3"
      },"devDependencies": {
        "@angular-builders/custom-webpack": "8.4.1","@angular-devkit/build-angular": "0.1102.9","@angular-devkit/core": "11.2.9","@angular-eslint/builder": "4.0.0","@angular-eslint/eslint-plugin": "4.0.0","@angular-eslint/eslint-plugin-template": "4.0.0","@angular-eslint/schematics": "4.0.0","@angular-eslint/template-parser": "4.0.0","@angular/cli": "11.2.9","@angular/compiler-cli": "11.2.10","@angular/language-service": "11.2.10","@babel/preset-env": "7.9.5","@types/chai": "4.2.11","@types/core-js": "2.5.3","@types/cucumber": "4.0.4","@types/dragula": "3.7.0","@types/jasmine": "2.8.8","@types/jasmine-jquery": "1.5.33","@types/jquery": "3.3.34","@types/karma-jasmine": "0.0.29","@types/node": "13.11.1","@types/sinon": "9.0.0","@types/typeahead": "0.11.32","@typescript-eslint/eslint-plugin": "2.31.0","@typescript-eslint/parser": "2.31.0","babel-core": "6.26.3","babel-loader": "8.1.0","babel-polyfill": "6.26.0","babel-preset-env": "1.7.0","chai": "4.2.0","codelyzer": "5.2.0","cucumber": "1.3.0","del-cli": "3.0.0","eslint": "6.8.0","eslint-config-prettier": "8.1.0","eslint-plugin-jasmine": "4.1.2","eslint-plugin-prettier": "3.3.1","eslint-plugin-sonarjs": "0.5.0","formdata-polyfill": "3.0.19","html-webpack-plugin": "4.2.0","jasmine-core": "3.5.0","jasmine-spec-reporter": "5.0.1","karma": "6.3.2","karma-chai": "0.1.0","karma-chrome-launcher": "3.1.0","karma-coverage-istanbul-reporter": "2.1.1","karma-cucumber-js": "1.0.3","karma-html-reporter": "0.2.7","karma-jasmine": "2.0.0","karma-jasmine-html-reporter": "1.5.3","karma-jasmine-jquery-2": "0.1.1","karma-junit-reporter": "2.0.1","karma-mocha-reporter": "2.2.5","karma-sinon": "1.0.5","prettier": "2.2.1","puppeteer": "5.5.0","sinon": "9.0.2","stats-webpack-plugin": "0.7.0","ts-node": "8.8.2","typescript": "4.0.7","webpack": "4.42.1"
      },

如果您需要我的任何进一步信息，请告诉我。