重新导出命名的 typescript 接口会引发错误答案

【问题标题】：Re-exporting named typescript interface throws error重新导出命名的 typescript 接口会引发错误
【发布时间】：2021-05-20 05:47:48
【问题描述】：

我有重新导出命名打字稿元素的问题。

我有一个类似这样的 react 文件：

CustomComponent/CustomComponent.tsx：

export interface CustomComponentProps { ... }

const CustomComponent: React.FunctionComponent<CustomComponentProps> = () => {
  ...
}
export default CustomComponent

自定义组件/index.ts：

import CustomComponent from './CustomComponent'
export { CustomComponentProps } from './CustomComponent'

export default CustomComponent

错误信息如下：

尝试导入错误：“CustomComponentProps”未从“./CustomComponent”导出。

或

import CustomComponent from './CustomComponent'
import { CustomComponentProps } from './CustomComponent'

export default CustomComponent
export CustomComponentProps

错误信息在哪里：

解析错误：需要声明或声明

CustomComponent/index.ts 工作正常时：

import CustomComponent from './CustomComponent'
export * from './CustomComponent'

export default CustomComponent

此错误的原因可能是什么以及如何修复它以使用类似（或类似）失败示例的导出？导出的格式很重要，因为需要控制从 index.ts 导出的内容。

【问题讨论】：

export CustomComponentProps 是无效的语法。它没有任何意义，纯粹是一个错误。
如果你这样做export type { CustomComponentProps } from './CustomComponent'会起作用吗？

标签： typescript ecmascript-6 es6-modules

【解决方案1】：

在重新导出之前，您需要将其转换为类型。这应该有效：


export type { CustomComponentProps } from './CustomComponent'

【讨论】：

【解决方案2】：

我在写这个问题时设法解决了我的问题，所以我分享了解决方案，因为我没有发现任何类似的问题：

import CustomComponent from './CustomComponent'
import {
  CustomComponentProps as CustomComponentPropsOriginal
} from './CustomComponent'

export default CustomComponent
export interface CustomComponentProps extends CustomComponentPropsOriginal {}

【讨论】：