webpack——devtool里的7种SourceMap模式

蔚落 2023-02-09 14:12 7阅读 0赞

我们先来看看文档对这 7 种模式的解释：

<table> 
 <thead> 
  <tr> 
   <th>模式</th> 
   <th>解释</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>eval</td> 
   <td>每个module会封装到 eval 里包裹起来执行，并且会在末尾追加注释&nbsp;<code>//@ sourceURL</code>.</td> 
  </tr> 
  <tr> 
   <td>source-map</td> 
   <td>生成一个<strong>SourceMap</strong>文件.</td> 
  </tr> 
  <tr> 
   <td>hidden-source-map</td> 
   <td>和 source-map 一样，但不会在 bundle 末尾追加注释.</td> 
  </tr> 
  <tr> 
   <td>inline-source-map</td> 
   <td>生成一个&nbsp;<strong>DataUrl</strong>&nbsp;形式的 SourceMap 文件.</td> 
  </tr> 
  <tr> 
   <td>eval-source-map</td> 
   <td>每个module会通过eval()来执行，并且生成一个DataUrl形式的SourceMap.</td> 
  </tr> 
  <tr> 
   <td>cheap-source-map</td> 
   <td>生成一个没有列信息（column-mappings）的SourceMaps文件，不包含loader的 sourcemap（譬如 babel 的 sourcemap）</td> 
  </tr> 
  <tr> 
   <td>cheap-module-source-map</td> 
   <td>生成一个没有列信息（column-mappings）的SourceMaps文件，同时 loader 的 sourcemap 也被简化为只包含对应行的。</td> 
  </tr> 
 </tbody> 
</table>

> 注1：
> 
> webpack 不仅支持这 7 种，而且它们还是可以任意组合上面的eval、inline、hidden关键字，就如文档所说，你可以设置 soure

发表评论取消回复

表情：

评论列表（有 0 条评论，7人围观）

还没有评论，来说两句吧...

相关阅读

相关 webpack——devtool里的7种SourceMap模式

我们先来看看文档对这 7 种模式的解释： <table> <thead> <tr> <th>模式</th> <th>解释</th> </tr>

蔚落/ 2023年02月09日 14:12/ 0 赞/ 8 阅读

相关设计模式 - 单例模式的7种实现

文章目录 1.饿汉式 2.懒汉式 3.同步懒汉式 4.Double Check 5.Volatile Double Check 6.H

我会带着你远行/ 2022年10月23日 15:25/ 0 赞/ 221 阅读

相关设计模式,7种构造型模式举例

在遥远的过去,有这么一个与世无争的小村子,村里有一个村长(A)和很多的村民(Bs). 围绕着这个小村子,发生了无数的可歌可泣的故事.当然,和其他的故事一样,村子之外有一

迷南。/ 2022年09月18日 08:00/ 0 赞/ 192 阅读

相关何为SourceMap？

做好事不留名的 sourcemap 当我们在开发代码的时候，遇到错误的时候可以在控制台定位到具体的问题，就像这样：![41025efd0d74fbbd397faf1654

迈不过友情╰/ 2022年09月16日 12:29/ 0 赞/ 344 阅读

相关 webpack sourcemap 选项多种模式的一些解释

有人说 Webpack 难用，原因是 sourcemap 有 7 种，本文就尝试解释下这些选项都是什么意思，不仅如此，本文还会分析如何用最好的姿势使用这些配置。先一项一项

淩亂°似流年/ 2022年07月28日 00:06/ 0 赞/ 242 阅读

相关 23种设计模式(7)-装饰者模式

装饰模式一、概述二、装饰模式的结构三、具体案列四、装饰模式与类继承的区别

浅浅的花香味﹌/ 2022年06月12日 01:40/ 0 赞/ 278 阅读

相关网卡的绑定7种模式

分析之前先说明ARP协议 1、ARP协议 ARP协议全称是Address Resolution Protocol，地址解析协议。主要用来提供IP地址和物理地址之间的映射

绝地灬酷狼/ 2022年06月11日 07:10/ 0 赞/ 265 阅读

相关 SourceMap 使用教程

小编推荐：[Fundebug][]专注于JavaScript、微信小程序、微信小游戏，Node.js和Java实时BUG监控。真的是一个很好用的bug监控费服务，众多大佬公司都

客官°小女子只卖身不卖艺/ 2022年05月19日 00:52/ 0 赞/ 246 阅读

相关单例模式的7种写法

[http://cantellow.iteye.com/blog/838473][http_cantellow.iteye.com_blog_838473] [http_c

深碍√TFBOYSˉ_/ 2022年04月23日 08:16/ 0 赞/ 256 阅读

相关 java--设计模式（7种）

设计模式设计模式（GOF，Gound Of Four）一共有23中，这些模式是为了让我们的代码更有效率而被开发的。 1、单例模式单例模式也就是虚拟机只有一个实

╰半橙微兮°/ 2022年04月13日 07:25/ 0 赞/ 87 阅读