使用 Source Map 可以在 FF 的调试器、 Chrome 的 Sources 和 VSCode 中给压缩前的文件下断点，也可以方便定位错误发生的位置（定位到压缩前的文件）。

何为 Source Map

Source Map 可以将编译、语法转换或压缩后的代码与源码进行对应，从而方便调试。

JavaScript Source Map 详解 - 阮一峰的网络日志

Source Map Revision 3 Proposal - Google 文档

Grunt 中使用

配置 sourceMap 为 true 即可（注意低版本 grunt-contrib-uglify 配置方法不一样）

https://github.com/gruntjs/grunt-contrib-uglify

前端工具-调试压缩后的JS（Source Map的使用）的更多相关文章

  1. Source Map调试压缩后代码

    在前端开发过程中,无论是样式还是脚本,运行时的文件可能是压缩后的,那这个时候调试起来就很麻烦. 这个时候,可以使用Source Map文件来优化调试,Source Map是一个信息文件,里面储存着原代 ...

  2. 当碰到需要调试打包后的js

    在react中经常开发碰到不能热更中进行调试的,如IE之类的 这个时候我们就需要打包才能运行看到效果, 但是往往每次打包都需要很长的时间: 这个时候我们就可以直接找到打包后的文件,直接在改文件中修改: ...

  3. 前端工具--利用Adblock Plus阻止js执行

    今天遇到个问题:需要阻止页面某个js的运行 效果达到

  4. 调试压缩后的Javascript文件：在 Chrome 和 Safari ，选择“脚本”标签，找到相应的文件，然后点击“{}”图标（pretty print，在面板底部）

  5. Source map error

    前端访问接口时火狐浏览器控制台出现了这个问题, source map文件是js文件压缩后,文件的变量名替换对应.变量所在位置等元信息数据文件,一般这种文件和min.js主文件放在同一个目录下. 比如压 ...

  6. js的map文件

    什么是source map文件 source map文件是js文件压缩后,文件的变量名替换对应.变量所在位置等元信息数据文件,一般这种文件和min.js主文件放在同一个目录下. 比如压缩后原变量是ma ...

  7. 第五十八篇：webpack的Source Map

    好家伙,Source Map没听过 1.什么是Source Map? 字面意义上来看应该是个好东西 Source Map 就是一个信息文件,里面储存着位置信息. 也就是说,Source Map 文件中 ...

  8. chrome调试找不到 XXXX.min.map 原因及解决办法

    什么是source map文件. source map文件是js文件压缩后,文件的变量名替换对应.变量所在位置等元信息数据文件,一般这种文件和min.js主文件放在同一个目录下. 比如压缩后原变量是m ...

  9. Fundebug微信小程序BUG监控服务支持Source Map

    摘要: 自动还原真实出错位置,快速修复BUG. Source Map功能 微信小程序的Source Map功能目前只在 iOS 6.7.2 及以上版本支持. 微信小程序在打包时,会将所有 js 代码打 ...

随机推荐

  1. CentOS7linux系统安装fpm服务，自己制作rpm包文件

    1.安装ruby环境 [root@oldboy /]# yum install -y ruby ruby-devel rubygems gem install fpm gem sources --ad ...

  2. Win10不能远程其他远程计算机的解决办法

    Win10不能远程其他远程计算机的解决办法   转自: https://blog.csdn.net/qq_38197830/article/details/69488236 首先打开控制面板——> ...

  3. ubuntu开机只有一条横杠在闪的解决办法

    1.制作U盘启动盘,并试用ubuntu 2.输入以下命令,根据提示完成修复 sudo add-apt-repository ppa:yannubuntu/boot-repair && ...

  4. 域名 端口 DNs 网络

    netstat -an   查看所有 所有监听端口的使用情况

  5. Kafka DockerFile

    FROM php:5.6.38-fpm COPY . /alidata/workerspace WORKDIR /alidata/workerspace RUN set -x && a ...

  6. socket服务器

    Python 3.x,已经改名为socketserver:Python 2. #coding=utf-8 #1.必须自己创建一个请求处理类,并且这个类要继承BaseRequesHandler,并且还要 ...

  7. web前端工程化

    目标 1.能够了解模块化的相关规范 2.了解webpack 3.了解使用Vue单文件组件 4.能够搭建Vue脚手架 5.掌握Element-UI的使用 1.模块化的分类 A.浏览器端的模块化 1).A ...

  8. CentOS 6.5下源码安装LAMP(Linux+Apache+Mysql+Php)环境

    ---恢复内容开始--- 一.系统环境 系统平台:CentOS 6.5 (Final) Apache版本:httpd-2.2.31.tar.gz(最新版本2015-07-16) Mysql 版本:my ...

  9. 2019-3-9-通过-frp-开启服务器打开本地的-ZeroNet-服务器外网访问

    title author date CreateTime categories 通过 frp 开启服务器打开本地的 ZeroNet 服务器外网访问 lindexi 2019-03-09 11:47:4 ...

  10. weblogic+idea

    1.首先是weblogic的安装,去官网下载,下载完成后,安装,然后还需要创建域,参考链接: https://www.cnblogs.com/xdp-gacl/p/4140683.html,创建域的h ...