使用别名时无法从 @fortawesome/free-regular-svg-icons 导入

Question

当我使用别名引用图标时，我无法导入它们。我特别注意到@fortawesome/free-regular-svg-icons 的问题。有时您需要使用别名，因为库中的图标可能存在重复名称，并且您希望将它们都导入。

这是在 Angular 小升级 (7.1 -> 7.2) 之前运行的代码。 这是来自fontawesome documentation 的指导。请参阅页面的最后一部分。

我已经尝试升级 fortawesome 软件包并使用正在导入的别名和图标。我注意到删除别名可以让我很好地导入图标。

应用模块

import { library, dom } from '@fortawesome/fontawesome-svg-core';

import { faSpinner, faCopy } from '@fortawesome/free-solid-svg-icons';
library.add(faSpinner, faCopy);

import { faCopy as farCopy } from '@fortawesome/free-regular-svg-icons';
library.add(farCopy); // <-- This is where the error is thrown

dom.watch();

相关包

"@angular/common": "^7.2.15",
"@angular/compiler": "^7.2.15",
"@angular/core": "^7.2.15",
"@angular/forms": "^7.2.15",
"@angular/http": "^7.2.15",
"@angular/material": "^7.2.0",
"@fortawesome/angular-fontawesome": "^0.3.0",
"@fortawesome/fontawesome-common-types": "^0.2.21",
"@fortawesome/fontawesome-svg-core": "^1.2.21",
"@fortawesome/free-regular-svg-icons": "^5.10.1",
"@fortawesome/free-solid-svg-icons": "^5.10.1",

浏览器错误 Uncaught ReferenceError: farCopy is not defined

Answer 1

我今天遇到了这个问题，但我使用的是 Typescript 而不是 Angular，不确定这个解决方案是否也适合你。

我的问题是从 free-regular-svg-icons 添加到 fontawesome-svg-core 时，我的打字稿会出现编译错误。

Argument of type 'IconDefinition' is not assignable to parameter of type 'IconDefinitionOrPack'.

当我这样做时

import { library } from '@fortawesome/fontawesome-svg-core';
import { faClock} from '@fortawesome/free-regular-svg-icons';
library.add(faClock); // <-- error here

对我有用的是迫使 faClock 不被评估

library.add(faClock as any);

评论是否适合您，如果此解决方案不能为您翻译，我将删除此帖子。