如何正确读取TypeScript错误堆栈跟踪？TS与JS行号对应疑问

不能直接通过JS错误堆栈里的行号去对应TS文件的相同行号，原因主要有这几点：

• TypeScript的语法糖（比如箭头函数、类、异步/await、装饰器等）会被编译成结构完全不同的JavaScript代码，行数会被打乱。比如一个TS里的类定义可能会被编译成好几行原型链相关的JS代码，原TS的1行可能对应JS的多行，反过来也一样。
• TS里的类型注解、接口声明这类纯类型代码会被tsc完全移除，不会出现在编译后的JS里，这也会导致行号的偏移。
• 开启代码压缩或混淆（比如配合Terser）的话，JS的行数、变量名都会被大幅修改，行号对应关系完全失效。

正确的做法：生成Source Map #

要让错误堆栈直接指向TS文件的正确位置，你需要在编译时开启Source Map功能：

1. 在tsconfig.json里设置"sourceMap": true
2. 编译后会生成对应的.js.map文件，和JS文件放在同一目录下
3. 浏览器或Node.js环境会自动读取Source Map，将JS的错误堆栈映射回原TS的行号和位置

这样你就能直接根据错误提示定位到TS文件里的准确代码了。

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