我在哪里从库中获取变量的打字稿类型

Question

我一直在研究一个反应型项目，在该项目中，我正在使用很多外部库，并且经常发现自己使用为这些库中使用任何类型。请查看下面的代码进行演示，

这是针对上述代码的 fontawesome库

import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import {
  faSquare,
} from '@fortawesome/free-regular-svg-icons';

interface IProps {
  title: string;
  icon: any;
  onClick?: () => void;
  sx?: { [index: string]: string };
}

const icons ={
 title :_,
icon : faSquare
}

， Icon的类型是什么类型。其价值为 fasquare 。当我徘徊时，类型为 icondefinition 。但是，我不确定要在哪里导入它，或者是这样做的方法。

Answer 1

@fortawesome软件包嵌入了自己的类型，因此自动推断出icons.icon的类型。

在VSCODE中，您可以右键单击并“转到类型定义”以检查类型。
在您的情况下，fasquare的类型是icondefinition

export interface IconDefinition extends IconLookup {
  icon: [
    number, // width
    number, // height
    string[], // ligatures
    string, // unicode
    IconPathData // svgPathData
  ];
}

您只需将其从@fortawesome/fortawesome/free-free-regular-Svg-icons'

import {faSquare, IconDefinition} from '@fortawesome/free-regular-svg-icons';