问题描述
限时送ChatGPT账号..我正在使用 Angular 6 angular-starter 和 fontawesome,然后是 这里 关于如何将 fa 安装到 ng.
在我的 .ts 中是这样的:
import { library, dom } from '@fortawesome/fontawesome-svg-core';从'@fortawesome/free-brands-svg-icons/faInstagram'导入{faInstagram};从@fortawesome/free-solid-svg-icons/faLink"导入{faLink};公共 ngOnInit() {library.add(faInstagram);library.add(faLink);dom.watch();}
然后在 .html 中:
<fa-icon [icon]="['fab', 'instagram']"></fa-icon>
除了免费品牌,@fortawesome/free-brands-svg-icons
之外,它工作得很好.在构建 (npm start) 时,它会产生错误/警告 IconDefinition"类型的参数不可分配给IconDefinitionOrPack"类型的参数.IconDefinition"不可分配给IconPack"类型.'IconDefinition' 类型中缺少签名.
在 92% 的构建中,但实际上构建似乎成功并且显示了 instagram 图标,但我很烦恼,因为代码下方出现了一条红线.
有人能弄清楚吗?
我的 package.json
"@fortawesome/angular-fontawesome": "^0.3.0","@fortawesome/fontawesome-svg-core": "^1.2.6","@fortawesome/free-brands-svg-icons": "^5.4.2","@fortawesome/free-solid-svg-icons": "^5.4.1",
解决方案 我将提到一个带有常规图标的案例.希望类似的方法对您有所帮助.您只需导入图标,然后将其从 IconDefinitionOrPack 类型转换为 IconDefinition,同时将其添加到模块构造函数中的库中.
import { faTimesCircle, faCheckCircle } from '@fortawesome/free-regular-svg-icons';
然后在将它添加到库中时对其进行类型转换
导出类 AppModule {构造函数(){library.add(faTable);library.add(faChartArea);library.add(faTachometerAlt);library.add(faTimesCircle as IconDefinition);library.add(faCheckCircle as IconDefinition);}}
在 HTML 中,
<fa-icon [icon]="['far', 'check-circle']"></fa-icon><span>税务信息</span>
I'm using Angular 6 angular-starter and fontawesome, followed here on how to install fa to ng.
In my .ts looks like this:
import { library, dom } from '@fortawesome/fontawesome-svg-core';
import { faInstagram } from '@fortawesome/free-brands-svg-icons/faInstagram';
import { faLink } from '@fortawesome/free-solid-svg-icons/faLink';
public ngOnInit() {
library.add(faInstagram);
library.add(faLink);
dom.watch();
}
Then in .html:
<fa-icon [icon]="['fab', 'instagram']"></fa-icon>
It works perfectly fine except for free brands, @fortawesome/free-brands-svg-icons
. On build (npm start) it produces error/warning Argument of type 'IconDefinition' is not assignable to parameter of type 'IconDefinitionOrPack'. 'IconDefinition' is not assignable to type 'IconPack'. signature is missing in type 'IconDefinition'.
on the 92% build but actually the build appears to be successful and the instagram icon shows up but I'm bothered because a red line below the code appears.
Can someone figure it out?
My package.json
"@fortawesome/angular-fontawesome": "^0.3.0",
"@fortawesome/fontawesome-svg-core": "^1.2.6",
"@fortawesome/free-brands-svg-icons": "^5.4.2",
"@fortawesome/free-solid-svg-icons": "^5.4.1",
解决方案
I'll mention a case with regular icons. Hope a similar approach will help you. You can just import the icon and then typecast it from IconDefinitionOrPack to IconDefinition while adding it to the library in your module constructor.
import { faTimesCircle, faCheckCircle } from '@fortawesome/free-regular-svg-icons';
Then while adding it in library typecast it
export class AppModule {
constructor() {
library.add(faTable);
library.add(faChartArea);
library.add(faTachometerAlt);
library.add(faTimesCircle as IconDefinition);
library.add(faCheckCircle as IconDefinition);
}
}
In HTML,
<div class="col-md-6">
<fa-icon [icon]="['far', 'check-circle']"></fa-icon>
<span>Tax Info</span>
</div>
这篇关于“IconDefinition"类型的参数不可分配给“IconDefinitionOrPack"类型的参数的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
更多推荐
[db:关键词]
发布评论