如何让TypeScript编译器解析非相邻本地文件的环境声明？

我在测试TypeScript编译器对本地文件环境声明的解析逻辑时发现，仅当.d.ts类型文件与源JS文件相邻时，编译器才能识别到对应的类型声明。当前项目结构及代码示例如下：

// 原位置：src/templates/Hello.d.ts（与Hello.js相邻）
declare function Hello(): string;
export default Hello;

// src/index.ts
import Hello from './templates/Hello.js'; // 仅当Hello.d.ts与Hello.js相邻时才能找到声明
Hello();

// tsconfig.json
{
  "compilerOptions": {
    "skipLibCheck": true,
    "noEmit": true
  },
  "include": ["src"]
}

现在希望将Hello.d.ts迁移到./src/types/Hello.d.ts目录下，但尝试过配置baseUrl+paths、三斜线指令、declare module等方法均未成功，以下是可行的解决方案：

方法一：模块扩展声明（最直接） #

在src/types/Hello.d.ts中直接为目标JS模块声明类型，TypeScript会自动关联到对应的导入语句：

// src/types/Hello.d.ts
declare module '../templates/Hello.js' {
  const Hello: () => string;
  export default Hello;
}

无需修改现有tsconfig.json，只要include包含src目录即可（当前配置已满足）。

方法二：typeRoots + 类型入口文件 #

1. 更新tsconfig.json，添加typeRoots指定类型文件根目录：

// tsconfig.json
{
  "compilerOptions": {
    "skipLibCheck": true,
    "noEmit": true,
    "baseUrl": "./src",
    "typeRoots": ["./src/types"],
    "paths": {
      "Hello": ["templates/Hello.js"]
    }
  },
  "include": ["src"]
}

2. 在src/types下创建入口文件index.d.ts，引入目标类型文件：

// src/types/index.d.ts
/// <reference path="./Hello.d.ts" />

3. 修改Hello.d.ts为模块形式：

// src/types/Hello.d.ts
declare module 'Hello' {
  const Hello: () => string;
  export default Hello;
}

4. 修改index.ts的导入路径为映射后的模块名：

// src/index.ts
import Hello from 'Hello';
Hello();

方法三：paths直接映射类型文件 #

通过paths将JS模块路径直接映射到类型文件：

// tsconfig.json
{
  "compilerOptions": {
    "skipLibCheck": true,
    "noEmit": true,
    "baseUrl": "./src",
    "paths": {
      "./templates/Hello.js": ["./types/Hello.d.ts"]
    }
  },
  "include": ["src"]
}

保持Hello.d.ts的导出形式与原文件一致：

// src/types/Hello.d.ts
declare function Hello(): string;
export default Hello;

内容的提问来源于stack exchange，提问作者errorline1