【仅供了解】简单介绍一下jquery.min.map文件

【摘要】相信每一位学习过jQuery的同学们一定会发现在不同的jQuery版本中，会出现类似什么什么.map、.min.map的文件，相信大家都有印象吧，其实是jquery.min.map或者类似于jquery-1.9.1.min.map的名称，这篇文章就来给大家讲解一下jquery.min.map文件。

首先介绍一下基本概念，分为如下四点：

第一点：从 jQuery 1.9.0 版本后在原始压缩后的代码里会有，如jquery-1.9.1.min.js文件中，第二行：

@ sourceMappingURL=jquery.min.map，

不信的话你可以打开压缩后的jQuery文件看看。

第二点，给出一个词汇：Source Map，Source Map就是一个Json格式的信息文件，这个文件的里面储存着位置信息。Source map是压缩后Js对应的一个字典文件，如果你的代码有了错误，那么调试工具就会直接显示原始代码，而不是压缩后的代码。

第三点，jquery.min.map就是对应版本的jQuery文件的Source Map。也就是说从jQuery 1.9.0之后的版本都会有Source Map文件用于当jquery.min.js文件出现错误的时候，显示的是jquery.js文件，而不是jquery.min.js文件。这样做的好处是：可以快速的找到错误的所在位置（行和列），但是如果不使用Source Map文件，则jquery.min.js文件出现错误的时候，那是相当难找到错误位置的。

第四点，也就是说不同的Source map文件是由不同的js文件产生的，而这些js文件可能是压缩后，合并后或者是其它语言编译成JavaScript。

目前支持jquery.min.map文件的浏览器有Google Chrome、Firefox Firebug的为数不多的浏览器。

可能出现的错误：

如果jquery.min.js文件中不存在对应的juqery.min.map的时候，可能会出现的错误：

当打开引入jQuery脚本的页面时，在Chrome的控制台中报了“GET http://localhost/libs/jquery.min.map 404 (Not Found)”的错误。

解決方法：下载同一版本的 source maps跟jquery.js同目录，source maps 会跟 jquery 同一文件夹

结论：

//@ sourceMappingURL=jquery.min.map

或者

//# sourceMappingURL=jquery.min.map

如果是布置到生产环境中去，你可以把上面那行代码直接删掉。

如果是在开发环境中，你应该下载jquery-1.10.2.min.map文件，放到jQuery同级目录中去（需要对应的source map文件）。

测试：

index.html页面代码：

1. <script type="text/javascript" src="./jquery-1.9.1/jquery-1.9.1.min.js"></script>

jquery-1.9.1目录下存在的文件有：

1. jquery-1.9.1.js

2. jquery-1.9.1.min.js

3. jquery.min.map	# 这个juqery.min.map 是 version 1.9.1 的，只是命名取成jquery.min.map

而将jquery-1.9.1.min.js中的某个命令误改（就是随便修改，使得js代码会报错），然后打开Google Chrome，会发现出现打开的文件是jquery-1.9.1.js文件的某行，如下图：

总结一句话，其实在真是上线的项目中是不使用jquery.min.map文件的，因为没有任何意义，这个文件仅仅供给程序员用于快速发现错误所在行和列。

我要打赏