如何让TypeScript在定义文件与JS源文件路径不同时指向源文件？

首先，咱们得先搞清楚问题出在哪：你的lib.d.ts是TypeScript类型定义文件，它只负责给TS编译器提供类型检查的信息，本身不包含任何可执行的JavaScript代码。当你在program.ts里写import Lib from "./typings/lib"时，TS编译成JS后，浏览器/服务器会尝试去加载./typings/lib.js这个文件，但你的目录里根本没有这个文件——只有lib.d.ts，所以自然会报404找不到资源的错误。

下面是具体的解决步骤：

1. 修正导入路径，指向实际的JS代码文件 #

你的实际功能代码在lib.min.js里，所以应该直接导入这个文件，而不是类型定义文件。修改program.ts里的导入语句：

// 替换原来的导入语句，指向实际的JS文件
import Lib from "./lib.min.js";
Lib.SomeFunction();

2. 让TypeScript识别lib.min.js的类型 #

现在导入了正确的JS文件，但TypeScript可能会提示找不到类型定义，这时候咱们可以用两种方法让它关联上lib.d.ts里的类型：

方法一：在lib.d.ts中添加模块声明 #

直接在lib.d.ts的顶部添加模块声明，告诉TS./lib.min.js对应的类型就是你定义的Lib：

declare module "./lib.min.js" {
  export default interface Lib {
    SomeFunction(): void;
    // 这里添加你需要的其他方法、属性的类型定义
  }
}

方法二：通过tsconfig.json配置路径映射 #

如果你想保持import Lib from "./lib"这样的简洁写法，可以在tsconfig.json里配置路径映射，让TS把./lib的导入指向lib.min.js，同时使用lib.d.ts的类型：

{
  "compilerOptions": {
    "baseUrl": "./scripts", // 以scripts目录为基础路径
    "paths": {
      "./lib": ["./lib.min.js"] // 映射路径
    },
    // 其他你原本的编译选项，比如target、module等
  }
}

配置完成后，你依然可以用import Lib from "./lib"来导入，TS会自动关联lib.d.ts的类型，编译后的JS则会正确指向lib.min.js。

3. 验证编译后的路径正确性 #

最后，检查一下编译生成的program.js里的导入路径是否正确。比如如果你的服务器是把scripts作为静态资源目录，那么./lib.min.js这个相对路径应该能被服务器正确找到，不会出现路径层级错误。

额外提醒 #

• .d.ts文件是给TS编译器用的，不需要被浏览器加载，也不需要被编译成JS文件。
• 永远不要把类型定义文件当作实际的代码模块来导入，实际导入的必须是包含可执行代码的.js（或.min.js）文件。

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