[!info] related notes

• 所属 MOC: TypeScript MOC
• 配置入口: tsconfig 使用详解
• 并列概念: TypeScript 中的 rootDir, TypeScript 中的 paths, TypeScript 中的 resolveJsonModule

TypeScript 中的 rootDirs

一句话定义

rootDirs 用来告诉 TypeScript：多个目录应被当成一个“虚拟根目录”来解析相对导入。

核心机制 / 工作原理

官方文档的定义很直接：

• many “virtual” directories acting as a single root

它的核心效果是：

• TypeScript 会把这些目录想象成已经合并到一起
• 然后按这个假设去解析相对路径导入

例如：

{
  "compilerOptions": {
    "rootDirs": ["src/views", "generated/templates/views"]
  }
}

这能让两边的文件像在同一个目录树里一样互相做相对导入解析。

最小例子 / 最小场景

它最典型的两类用途是：

• 源码目录和生成代码目录合并理解
• 源码目录和生成的 .d.ts 目录合并理解

官方文档还特别举了一个很实用的模式：

• src/ 里是真实源码
• generated/ 里是为非代码文件生成的声明文件

这样像 import "./main.css" 这类导入，就可以通过对应的 main.css.d.ts 被理解。

边界与易混淆点

它不影响 emit

官方文档明确说：

• it only emulates the assumption

也就是它只影响 TypeScript 如何理解这些路径，不改变 JavaScript 输出目录结构。

它不等于 rootDir

rootDir 更偏：

• 输出目录从哪个共同根开始截取

而 rootDirs 更偏：

• 多个目录在解析时被视作一个虚拟根

它也不等于 alias

rootDirs 讨论的是相对导入在多个目录间的虚拟合并关系，不是 @/foo 这类别名映射。

参考信息

• TSConfig rootDirs: https://www.typescriptlang.org/tsconfig/rootDirs.html