Chrome 更新后出现了 jquery.min.map 404  (Not Found) 的信息

这个到底是什么东西?查询了一下,得到了以下资料

摘录一下內容

从 jQuery 1.9.0 版本后在原始代码里会有 @ sourceMappingURL=jquery.min.map

什么是Source map

简单说,Source map就是一个信息文件,里面存储着位置信息。也就是说,转换后的代码的每一个位置,所对应的转换前的位置。

有了它,出错的时候,除错工具将直接显示原始代码,而不是转换后的代码。这无疑给开发这带来了很大方便。

导致  jquery.min.map 404 原因

更新后 Chrome 自行开启了 Enable source maps 的选项但你又沒有放 Source map 导致找不到档案。

解决办法

解決方式1.

将 Developer Tools ->设置 Enable source maps 关闭

解決方式2.

下载同一版本的 source maps跟jquery.js同目录

source maps 会跟 jquery 同位置

Jquery 位置 http://code.jquery.com/jquery-1.10.2.min.js

source maps 位置  http://code.jquery.com/jquery-1.10.2.min.map

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

刚开始以为是Chrome安装插件导致的错误,可是把引入换成jQuery开发版本时,错误就不见了。并且只有Chrome会有这个错误提示,FireFox、IE不会报错。

后来发现原来是jQuery脚本中 "//@ sourceMappingURL=jquery-1.10.2.min.map" 这一行惹的祸。

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

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

如果想关掉错误提示,还可以在Chrome的Developer Tools的Setting中将Enable source maps取消选中。

为什么这行被注释掉的代码,会起作用呢?那么就需要了解一下什么是Source Map。

什么是Source Map

Source map就是一个Json格式的信息文件,里面储存着位置信息。也就是说,它是压缩后Js的一个字典文件。有了它,出错的时候,调试工具将直接显示原始代码,而不是压缩后的代码。这无疑给开发者带来了很大方便。

因为是Google自定义的规则,暂时只有基于Chromium开发的浏览器支持这个功能。

Source Map生成工具

Closure编译器

参考链接

jquery.min.map 404 (Not Found)出错的原因及解决办法的更多相关文章

  1. 去除jquery.min.map 404错误信息

    调试中出现了 jquery.min.map 404 (Not Found) 的js错误信息: 那么jquery.min.map到底是个什么呢? JQuery 官方解释 从 jQuery 1.9.0 版 ...

  2. jquery ajax 中不能给变量赋值的原因及解决办法

    我们在用JQuery的Ajax从后台提取数据后想把它赋值给全局变量,但是却怎么都赋不进,为什么呢? 原因其实很简单,我们用的Ajax是异步操作,也就是说在你赋值的时候数据还没提取出来,你当然赋不进去, ...

  3. phpunit安装出错的原因及解决办法

    官方指引 很遗憾, phpunit还没有在ArchLinux的仓库里. 所以使用下载安装的方式.按照官方的指引: wget https://phar.phpunit.de/phpunit.phar c ...

  4. javascirpt的json.stringify()方法在IE浏览器兼容性模式下出错的原因与解决办法

    今天开机混底薪的时候遇到一个JSON.stringify()在IE浏览器兼容模式下的问题. 问题描述 一个弹窗选择的功能原来好好的,突然就不行了. 想要调试调试不了,报错信息也看不到(一开F12这破I ...

  5. 浏览器提示:源映射错误:request failed with status 404 源 URL:http://xxx.js 源映射 URL:jquery.min.map

    浏览器 jquery1.9.1min.js 报脚本错误 无jquery.min.map 文件 最近在浏览个人网站的时候就遇到了这个问题 我先说一下什么是source map文件. source map ...

  6. jquery.min.map详见

    温故而知新,翻出来阮前辈的文章记录一下 日期:2013年1月23日 上周,jQuery 1.9发布. 这是2.0版之前的最后一个新版本,有很多新功能,其中一个就是支持Source Map. 访问 ht ...

  7. charme浏览器 jquery1.9.1min.js 报脚本错误 无jquery.min.map 文件

    http://www.vipaq.com/Article/View/blog/357.html /*! jQuery v1.9.1 | (c) 2005, 2012 jQuery Foundation ...

  8. es6 Object.assign ECMAScript 6 笔记(六) ECMAScript 6 笔记(一) react入门——慕课网笔记 jquery中动态新增的元素节点无法触发事件解决办法 响应式图像 弹窗细节 微信浏览器——返回操作 Float 的那些事 Flex布局 HTML5 data-* 自定义属性 参数传递的四种形式

    es6 Object.assign   目录 一.基本用法 二.用途 1. 为对象添加属性 2. 为对象添加方法 3. 克隆对象 4. 合并多个对象 5. 为属性指定默认值 三.浏览器支持 ES6 O ...

  9. jquery ajax success 函数 异步调用方法中不能给全局变量赋值的原因及解决办法

    jquery ajax success 函数 异步调用方法中不能给全局变量赋值的原因及解决办法   在调用一个jquery的ajax方法时我们有时会需要该方法返回一个值或者给某个全局变量赋值,可是我们 ...

随机推荐

  1. 《我爱背单词》 Alpha版 发布说明

    ——发布地址(baidu网盘) http://pan.baidu.com/s/15omtB ——简介  <我爱背单词>是一款英语单词记忆和管理辅助软件,旨在帮助广大考生在短期内攻克GRE. ...

  2. websevice中runtime modeler error: Wrapper class com.ws.jaxws.Add is not found问题的解决办法

    查询了网上的资料,有以下解决办法: 1> 先用apt命令将主程序进行编译,然后生成一些java文件2> 升级JDK到版本jdk1.6u17或以后 这两种办法我没有试过,但是试了以下这种方法 ...

  3. Unity学习疑问记录之保卫伦敦塔学习体会

    1.生成的prefab如果要产生反向: Instantiate(Rocket, rocketPosition.position, Quaternion.Euler(new Vector3(0,0,18 ...

  4. 响应式Web设计 - 布局

    可扩展的布局 有一种流体布局的概念在早起web兴起的时,就开始盛行了.它的概念是说页面会根据浏览器窗口的变化进行更改,网站可以通过维护一套代码,保质一致性的设计.我这里强调的可扩展的布局也是基于这个概 ...

  5. 登录FTP,下载并读取文件内容

    maven 添加jar <dependency> <groupId>commons-net</groupId> <artifactId>commons- ...

  6. 2016 年 50 个最佳的轻量级 JavaScript 框架和库

    作者:IT程序狮链接:https://zhuanlan.zhihu.com/p/24598210来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. 回顾今年已发布的 JS ...

  7. angular前端开发环境

    1.代码编辑工具 webstorm 2.断点调试工具 chrome插件Batarang 3.版本管理工具 git(仅仅是命令行工具) git小乌龟--tortoisegit(图形化工具) 首先在git ...

  8. asp.net mvc 过滤器

    https://docs.microsoft.com/en-us/aspnet/core/mvc/controllers/filters#ordering 1. 对于应用在 Action 上的多个行为 ...

  9. ASP.NET Web Api

    1.参考资料 Routing in Asp.NET Web Api: http://www.asp.net/web-api/overview/web-api-routing-and-actions/r ...

  10. 兼容iOS 10 资料整理笔记

    原文链接:http://www.jianshu.com/p/0cc7aad638d9 1.Notification(通知) 自从Notification被引入之后,苹果就不断的更新优化,但这些更新优化 ...