TypeScript：我可以在不编写 index.ts 文件的情况下导入文件夹吗？

Posted 2023-02-22

【中文标题】TypeScript：我可以在不编写 index.ts 文件的情况下导入文件夹吗？

【英文标题】：TypeScript: Can I import a folder without having to write an index.ts file?

【发布时间】：2017-11-19 12:23:46

【问题描述】：

如果项目的大多数目录包含不超过 2-3 个 TypeScript 文件，并且在将包含目录导入其他地方时应该可以访问它们的所有导出，这会导致大量具有可预测内容的 index.ts 文件。

示例

目录：my-component

my-component-config.ts
my-component.ts
index.ts

index.ts 包含什么？当然，它包含

export * from "./my-component-config"
export * from "./my-component"

这很明显。

对于 10 个组件目录，这意味着：10 个 index.ts 文件包含 100% 冗余信息。

如何让 TypeScript(/Node) 隐式创建 index.ts 文件，无需存储在硬盘上？

【参考方案1】：

我认为没有办法在没有索引文件的情况下在 TS 中导入目录

如果您还没有，请检查这些问题

How to import all modules from a directory in TypeScript?

Typescript 1.8 modules: import all files from folder

我认为最好的方法是编写一个脚本来生成index.ts，该脚本会导入目录中的所有文件，并在每次添加/删除文件时运行该脚本。

【参考方案2】：

Component 在 TypeScript 和 node.js 中不是一个定义明确的概念，但 module 和 package 是。

一般来说，模块是一个源文件，让我们忽略异常。因此，通过为每个目录创建 index.ts 文件，您正在生成每个仅聚合几个文件/模块的外观模块。如果您只想将源文件组织成逻辑组件，则不需要按目录的外观，您可以简单地单独导入每个文件，而不是一次导入一个目录。

在更高的级别上，如果您有一个包含多个不同目录的包，它可以在包级别有一个单个 index.ts 外观。该文件将只导出每个文件/模块一次，不需要每个目录index.ts。所以这可能看起来像（假设每个都是一个 .ts 文件）：

export * from './IntStream';
export * from './misc/Interval';
export * from './misc/IntervalSet';
export * from './Lexer';
...

【讨论】：

我明白了。通常我什至单独导入文件而不是一次导入一个目录。但由于我更喜欢​​处理短路径，通常不超过 2 个段，所以我更喜欢导入目录。我举个例子：感谢index.ts 文件，我可以使用import Dialog from "lib/dialog" 而不是import Dialog from "lib/dialog/dialog" 导入lib/dialog/dialog.ts。看到不同？现在想象一下，我在数百个 TypeScript 文件中进行了类似的导入。

你的意思是from "./lib/dialog/dialog"。使用至少一个外观是最安全的，这样任何消费模块都不知道内部目录结构。

我的意思是from "lib/dialog/dialog"，因为它的父文件夹被指定为模块目录。没有任何外墙不会给我带来相当大的安全损失。但是为小组件使用立面给我带来了相当大的效率损失。我可以通过使用访问修饰符和readonly来保证安全。

这是个人意见，但我建议您不要有深入目录结构的外部引用（例如from "lib/dialog/dialog"。恕我直言，这暴露了太多的包@ 987654333@的内部结构。这不是一个硬性规定，如果你想在GitHub上分享一个特定的项目或其他东西，我很乐意审查和评论你的具体案例。

还要认识到你的包级外观可能不仅仅包含重新导出语句。例如。公开一个使用 dialog 类的高级函数可能会更好，而不是（或除此之外）公开类本身。