ts 打开sourcemap_调试篇 – Source Map - Node.js 调试指南

4.1.1 什么是 Source Map？

对于 Source Map，想必大家并不陌生，在前端开发中通常要压缩 JavaScript，CSS，以减小体积，加快网页显示。但带来的后果是如果出现错误，就会导致无法定位错误，这时 Source Map 应运而生。举个例子， jQuery 1.9 引入了 Source Map，打开 http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js，最后一行是这样的：

//@ sourceMappingURL=jquery.min.map

这就是 Source Map。它是一个独立的 map(其实就是 JSON) 文件，通常与源码在同一个目录下。

Source Map 常用于以下几个场景：

压缩代码，减小体积。比如 jQuery 1.9 的源码，压缩前是 252KB，压缩后是 32KB。

多个文件合并，减少 HTTP 请求数，仅用于前端。

将其他语言编译成 JavaScript，例如：CoffeeScript、TypeScript 等。

本节只讲解如何使用 Source Map，关于 map 文件中字段的含义本节不会解释，有兴趣的读者可以查看参考链接中的文章。接下来我们在 Node.js 环境下以场景 1、3 为例，分别介绍如何将 uglify-es 和 TypeScript 结合 Source Map 使用。

4.1.2 uglify-es

uglify-js 是最常用的 JavaScript 代码压缩工具，但只支持到 ES5，uglify-e