错误 TS2604:JSX 元素类型“...”没有任何构造或调用签名

Ale*_* B. 3 typescript reactjs

我正在创建一个包,其中包含我们在我工作的公司中创建的通用组件,我们希望可用于所有项目。我们使用 TypeScript,我将代码移到一个新项目中,我可以发布到 npm 并将包添加到我的一个项目的依赖项部分。但是,当我尝试使用它时,我收到一个编译错误说

error TS2604: JSX element type 'Loader' does not have any construct or call signatures.

我的代码(简化)如下所示:

import Loader from "my-common-components";
export class Contact extends React.Component<any, any> {
.
.
.
    public render() {
        this.state.loading) && <Loader />
        <div>Hello World</div>
    }
}
Run Code Online (Sandbox Code Playgroud)

linter 表明错误出在<Loader />部件上,但是此组件 ( Contact)的代码没有更改,我只是Loader从项目中移开并移到了单独的包 ( my-common-components) 中。

Ale*_* B. 6

所以事实证明错误是在移动到单独的包时,我将组件添加到重新导出组件的索引文件中。但是通过这样做,我使它不再是默认导出。事后看来有点明显。因此,解决方法是将组件名称的名称括在花括号中,以便导入实际命名的组件,如下所示:

import { Loader }from "my-common-components";

就是这样。我希望我能避免有人犯同样的错误,因为在搜索时我发现很多地方描述了相同的错误但由不同的根源引起,例如 Typescript 版本和错误的required指令。