typescript - 如何在 Typescript 中扩展/覆盖导出的类型

Question

我正在使用 @fortawesome和 @fortawesome/react-fontawesome . @fortawesome/fontawesome-common-types定义 IconDefinition作为

export interface IconLookup {
  prefix: IconPrefix;
  // IconName is defined in the code that will be generated at build time and bundled with this file.
  iconName: IconName;
}

export interface IconDefinition extends IconLookup {
  icon: any[];
}

export type IconProp = IconLookup | /*...*/;

export type IconName = /* a lot of concatenated strings */;

@fortawesome/react-fontawesome定义

export function FontAwesomeIcon(props: Props): JSX.Element;
export interface Props {
    icon: IconProp;
    /* ... */
}

我想添加我自己的 SVG 并在 icon 中使用它们 <FontAwesomeIcon /> 的属性(property).

import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';

type CustomIconName = 'myCustomIcon' /* | ... */;
interface CustomIconDefinition extends Pick<IconDefinition, Exclude<keyof IconDefinition, 'iconName'>> {
    prefix: 'fab',
    iconName: CustomIconName;
}

const MyCustomIcon: CustomIconDefinition = /* ... */;

export default function() {
    let icon: any = MyCustomIcon;
    return <FontAwesomeIcon icon={icon} />;
}

只要 icon 就可以使用类型为 any .

我想删除 CustomIconDefinition并覆盖或扩展 IconName包含的定义 MyCustomIcon .

我想做这样的事情:

import { IconName as VanillaIconName } from '@fortawesome/fontawesome-common-types';
declare module "@fortawesome/fontawesome-common-types" {
    export type IconName = VanillaIconName | MyCustomIcon;
}

这导致 Duplicate identifier 'IconName'. index.d.ts(16,13): 'IconName' was also declared here.我怀疑即使我解决了这个问题，它也会出错，因为 IconName = VanillaIconName引入循环定义。

我还想覆盖 FontAwesomeIcon定义，但我并没有深入了解，因为 icon: IconProp是几种类型深。我想我可以创建自己的 CustomFontAwesomeIcon extends FontAwesomeIcon ，但这并不理想。

Answer 1

2.5 年后我突然想到，虽然 type无法合并扩充声明，interface声明合并是。
我还没有测试过这个代码，因为我什至不记得我需要它用于哪个项目，但我应该能够增加 Props的 @fortawesome/react-fontawesome .

import { IconProp } from '@fortawesome/fontawesome-common-types';

declare module '@fortaweome/react-fontawesome' {
  export interface Props {
    icon: CustomIconProp;
  }
}

type CustomIconName = 'myCustomIcon' /* | ... */;

interface CustomIconProp extends Omit<IconProp, 'iconName'> {
  iconName: CustomIconName;
}

这并不能解决标题中提出的问题，但确实解决了我遇到的问题。

注意:通过使用 patch-package 覆盖包的声明文件，有一种 super 黑客方法可以解决标题带来的问题。 .遗憾的是，我之前对我必须使用的依赖版本采取了这种方法，但是 future 的版本修复了我需要的类型。