大家都有过用-min.js开发的经历，但这样的脚本调试非常头疼。如果使用为压缩版的，上线前又要去压缩，sourcemap的出现完美解决了这一问题。

即便是chrome提供了格式化代码但阅读压缩后的代码环视很吃力的。

以angularjs为例，谈谈sourcemap的使用。

我的文件夹结构如下：

由于google经常被墙所以建议把angular.js angular.min.js angular.min.js.map都下载到本地。

并且修改angular.min.js中sourcemap的配置，指向本地map文件。

//# sourceMappingURL=angular.min.js.map

html代码如下：

如果开发过程中出现错误，就可以很容易定位到源码位置，找出问题原因。

未使用surcemap

使用sourcemap

目前很多类库都提供了sourcemap的支持。

[javascript]巧用sourcemap快速定位javascript中的问题的更多相关文章

  1. 【转】如何快速定位JVM中消耗CPU最多的线程？

    [转]如何快速定位JVM中消耗CPU最多的线程? https://mp.weixin.qq.com/s?__biz=MzIwMzg1ODcwMw==&mid=2247487802&id ...

  2. 如何快速定位JVM中消耗CPU最多的线程？

    第一步.先找出Java的进程PID ps -ef | grep 进程名关键字 这里假设找到的PID是:12345   第二步.找出该进程内最消耗CPU的线程 top -Hp log4x R :11.7 ...

  3. 如何快速定位JVM中消耗CPU最多的线程？ Java 性能调优

    https://mp.weixin.qq.com/s/ZqlhPC06_KW6a9OSgEuIVw 上面的线程栈我们注意到 nid 的值其实就是线程 ID,它是十六进制的,我们将消耗 CPU 最高的线 ...

  4. java editor template Eclipse中的快速Java\JavaScript代码模板使用

    java editor template Eclipse中的快速Java\JavaScript代码模板使用 学习了:http://technicalsearch.iteye.com/blog/2150 ...

  5. javascript 技巧总结积累（正在积累中）

    1.文本框焦点问题 onBlur:当失去输入焦点后产生该事件 onFocus:当输入获得焦点后,产生该文件 Onchange:当文字值改变时,产生该事件 Onselect:当文字加亮后,产生该文件 & ...

  6. 快速掌握JavaScript面试基础知识(三)

    译者按: 总结了大量JavaScript基本知识点,很有用! 原文: The Definitive JavaScript Handbook for your next developer interv ...

  7. 快速掌握JavaScript面试基础知识(二)

    译者按: 总结了大量JavaScript基本知识点,很有用! 原文: The Definitive JavaScript Handbook for your next developer interv ...

  8. 怎样才能快速成为JavaScript高手

    如何快速成为JavaScript高手?之前我拿这个问题问过我的同事,也问过国内的一些JavaScript高手. 最近,我一直在拿这个问题问自己.之所以会有这个问题,我基于两个前提:第一.我自认为自己不 ...

  9. 快速了解JavaScript的基础知识

    注释 单行注释: // 单行注释 多行注释: /* 多行 注释 */ 历史上 JavaScript 可以兼容 HTML 注释,因此 <!-- 和 --> 也可以是单行注释. x = 1; ...

随机推荐

  1. boost::any 用法

    boost::any可以存放任何类型的C++类型,也可以是用户自定义的类型.非常方便,可以很方便的满足在运行过程中判断数据类型,从而进行相关的操作. 函数原型: // In header: <b ...

  2. zip解压破解

    B2TQZJEpzFAUHcHaTQRjtKi8C4Q5mpFsBFLYsNTfCs7ZD65X

  3. 好用的http client库CPP REST SDK

    前言 C++中http client库本身就少,好用的就更少了,在了解微软开源的CPP REST SDK库之前,我知道的C++ http client库有libcurl(这个是C语言的),Qt的QNe ...

  4. 用74HC165读8个按键状态

    源:用74HC165读8个按键状态 源:74LV165与74HC595 使用 74LV165说明: 74LV165是8位并行负载或串行输入移位寄存器,末级提供互补串行输出(Q7和Q7).并行负载(PL ...

  5. 20145312 《Java程序设计》第六周学习总结

    20145312 <Java程序设计>第六周学习总结 学习笔记 Chapter10 输入 /输出 10.1InputStream 与 OutputStream 10.1.1 串流设计的概念 ...

  6. Finder Quick Menu FAQ

    How to use Finder Quick Menur: 1. Start Finder Quick Menu.2. Open "System Preferences -> Ext ...

  7. wechat4j获取用户昵称乱码修复

    项目对接微信公众号平台时,微信的官方给出的建议是使用wechat4j.官方建议的,自然心里踏实,但实际用起来时发现wechat4j埋有很多雷,最让人心烦意乱的就是中文乱码问题. 之前写过一篇为JAXB ...

  8. LeetCode——remove-duplicates-from-sorted-list

    Question Given a sorted linked list, delete all duplicates such that each element appear only once. ...

  9. ng2 quickstart

    1.下载 git clone https://github.com/angular/quickstart.git quickstart-angular 2.安装模块 npm install 3.启动 ...

  10. Sqoop-问题

    1.权限问题 // :: INFO mapreduce.Job: Job job_1555064328415_0328 failed with state FAILED due to: Job set ...