webpack devtools_webpack loader和plugin的区别

webpack devtools_webpack loader和plugin的区别前言devtool也是之前常用的一个配置,我们稍微了解下吧,不研究太深,毕竟现在都不怎配置他。内容devtool是配置sourceMap的。sourceMap大家都知道,我们本地或者测试环境出了错误,可以在source中迅速定位错误,用到的就是.map(map文件),这个文件中是源文件映射(主要是源文件代码)。但是我们在network中看不到.map文件的请求,盲猜一波是浏览器做了屏蔽,不让我们看这种请求。(毕竟是源码,我单独下载map文件是可以下载下来的)接下来,当devtool被配置为

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE稳定放心使用

前言

devtool也是之前常用的一个配置,我们稍微了解下吧,不研究太深,毕竟现在都不怎配置他。

内容

devtool是配置sourceMap的。
sourceMap大家都知道,我们本地或者测试环境出了错误,可以在source中迅速定位错误,用到的就是 .map (map文件),这个文件中是源文件映射(主要是源文件代码)。但是我们在network中看不到.map文件的请求,盲猜一波是浏览器做了屏蔽,不让我们看这种请求。(毕竟是源码,我单独下载map文件是可以下载下来的)

接下来,当devtool被配置为以下各个值的时候,对应的source-map状态

source-map

产生一个单独的source-map(.map)文件,打包的js文件里面最下行有map文件的地址。功能最完全,但会减慢打包速度。

eval

每个 module 会封装到 eval 里包裹起来执行,并且会在末尾追加注释 //@ sourceURL,所以一个chunk文件可能有很多个module。

inline开头

source-map被base64转码后,放在打包的js文件里面最下行
在这里插入图片描述

hidden开头

打包后有.map文件,打包后的js中没有sourceMappingURL,也没有base64转码后的内容(这种配置我很懵,有啥用)
在这里插入图片描述

eval开头(不是eval)

打包后的js代码和Source Map内容混淆在一起,通过eval输出。
在这里插入图片描述

cheap开头

.map中的源码经过loader处理了,我们点击到source看的时候是ES3、4、5的代码。

总结

还有一些平常不太用到的没有写出来,先这样吧

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/185451.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • python中循环遍历for怎么用_python遍历字典的值

    python中循环遍历for怎么用_python遍历字典的值在Python中,如何使用“for”循环遍历字典?今天我们将会演示三种方法,并学会遍历嵌套字典。在实战前,我们需要先创建一个模拟数据的字典。dict_1={‘Name’:’Zara’,’Age’:7,’Class’:’First’,’Address’:’Beijing’}方法1:使用For循环+索引进行迭代在Python中遍历字典的最简单方法,是将其直接放入for循环中。Python会自动将dict_1视为字典,并允许你迭代其key键。然后,我们就可以使用索引

    2022年8月12日
    4
  • dirmap + dirsearch 安装和使用教程「建议收藏」

    dirmap + dirsearch 安装和使用教程「建议收藏」0x00安装运行报错一个一个模块安装很麻烦,看看dirmap给的requirement.txtgeventrequestsprogressbar2lxml直接pip3install-rrequirement.txt愉快的开始0x01使用

    2022年9月28日
    3
  • brave浏览器百度百科_世界之窗浏览器下载安装

    brave浏览器百度百科_世界之窗浏览器下载安装给大家安利一个当前世界上最快的新浏览器,Brave狮子王浏览器!如果你经常浏览网页,你一定能体会到打开一个网页比寻常时候快了几秒钟是怎样一种体验,一个优秀的浏览器不仅能为你带来流畅的体验,还能为你节约一定的时间。而且他最爽的一点是超级强力的反tracking,反cookie和反ads。最大化保护隐私! 一直以来我都是chrome浏览器的粉丝,因为chrome的极速还有他…

    2022年4月19日
    73
  • springboot zuul网关_ubuntu网关服务器搭建

    springboot zuul网关_ubuntu网关服务器搭建目录一.Zuul网关二.Zuul服务的前期准备2.1注册中心EurekaServer的搭建2.2EurekaService的搭建三.Zuul服务搭建五.Zuul的访问六.Zuul的更多功能前言:博主一直力求做到写博客尽量的详细来减少大家花在踩坑上的时间,若有写的不好或错误的地方,还需各方大佬指正。一.Zuul网关网关,是一种网络关口,既然是…

    2022年8月15日
    6
  • 博客内容概要

    前言python课程周期及相关内容计算机基础操作系统和网络基础知识计算机硬件历史计算机硬件知识网络基础之网络协议Python开发Python基础pycharm安装PyCharm常用

    2022年3月29日
    51
  • mp4 文件中的h264 avc1格式介绍

    mp4 文件中的h264 avc1格式介绍转自:http://www.mworkbox.com/wp/work/314.htmlMP4的视频H264封装有2种格式:h264和avc1,对于这个细节,很容易被忽略。笔者也是在改编LIVE555流媒体时,增加mp4文件类型支持时遇到了该问题。(一)首先,从原理上了解一下这2种格式的区别:AVC1描述:H.264bitstreamwithoutstartcode

    2022年10月17日
    3

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号