Javascript Typescript中带点符号的多个导出 参考。

我正试图做完全相同的事情，但是用Typescript

问题 此行（在export语句之前）：

给出编译错误：

类型“typeof Sidebar”上不存在属性“Item”

尝试解决方案1 我尝试将项添加到侧边栏类定义中，如下所示：

class Sidebar extends Component<SidebarProps, SidebarState> {
    Item: SidebarItem;
    ...
}

而不是将项添加到我的类定义中，而是像这样导出这两个类：

export default Sidebar;
export { SidebarItem as Item };

它可以编译，我可以像这样导入所有内容：

import * as Sidebar from '...';

但我必须这样使用它们：

<Sidebar.default>
    <Sidebar.Item></Sidebar.Item>
    <Sidebar.Item></Sidebar.Item>
</Sidebar.default>

我真的想去掉

侧栏中的
默认值

我做错了什么？
这个模块设计上有缺陷

这很可能可以通过以下方式实现：

export class SidebarItem ...

export default class Sidebar extends Component<SidebarProps, SidebarState> {
    static Item = SidebarItem;
    ...
}

项目
在需要时无法从默认导出中进行树摇动
Sidebar.Item
缩小的效率低于
SidebarItem
您的第一个解决方案几乎是正确的，但是您将
Item
声明为
Sidebar
类的对象上的属性，而不是类本身上的属性。您可以通过静态属性声明来实现后者。这应该起作用：

export class SidebarItem ..
..
class Sidebar extends Component<SidebarProps, SidebarState> {
  static Item = SidebarItem;
..
export default Sidebar;

export class SidebarItem。。
..
类边栏扩展组件{
静态项=侧压力项；
..
导出默认边栏；

您将不再需要行
Sidebar.Item=SidebarItem；
，但您可能需要移动
SidebarItem
类，使其出现在
Sidebar
之前。导入将只是
import Sidebar from'.''.
非常感谢您的详细回答！
没有充分的理由说明为什么这两个组件应该保持这样的层次结构
你这么说仅仅是因为类名吗？请注意，这些类名不是真实的（我只是使用了与链接问题中相同的类名）。我的实际情况非常不同，在没有其他组件的情况下，任何组件都不会被使用（
Item
将始终是
侧栏的子项。不客气。无论如何，请记住，使用组件类作为子项的命名空间不是常规做法（缩小是唯一想到的真正问题，但可能还有其他问题）。
export class SidebarItem ...

export default class Sidebar extends Component<SidebarProps, SidebarState> {
    static Item = SidebarItem;
    ...
}

export { Sidebar, SidebarItem };

export class SidebarItem ..
..
class Sidebar extends Component<SidebarProps, SidebarState> {
  static Item = SidebarItem;
..
export default Sidebar;