如何使用source map

source map 是用来干什么的?

作用 :通过 source map 定位到源代码
开发环境开启,线上环境关闭 (线上排查问题的时候可以将 source map 上传到错误监控系统)

source map 关键字

  • eval:使用eval包裹模块代码 (不会产生文件,直接放到js中)
  • source map :产生 .map 文件
  • cheap:不包含列信息
  • inline:将 .map作为DataURL嵌入,不单独生成 .map 文件
  • module:包含loader的sourcemap
image.png

总结:devtool:'source-map' 可以把打包好的文件再浏览器上看到源码。更加方便我们定位bug。cheap-source-map 只显示行的信息,不显示列。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1. 简介 sourceMap,顾名思义,就是对源文件的映射。比如打包压缩后的代码对应源文件中的哪一行代码,这能够...
    love丁酥酥阅读 860评论 0 1
  • publicPath指定了一个在浏览器中被引用的URL地址。 对于使用 和 加载器,当文件路径不同于他们的本地磁盘...
    飞呀飞哥阅读 1,720评论 0 0
  • source map的使用 devtool 此选项控制是否生成,以及如何生成 source map。 使用 Sou...
    辣瓜瓜阅读 576评论 0 0
  • 你聆听过自己的身体吗? 对的,你没看错,不是凝视,不是触碰自己的身体,而是聆听自己的身体。 你也曾凝视过自己的身体...
    猫言喵语阅读 153评论 0 0
  • 爷爷好: 毕竟扎个刺还有点疼,何况针刀呢,多痛我也会接受。受不了不是我受不了,而是这次涨价我家庭受不了,我哥老大也...
    安慰自己阅读 270评论 0 0