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)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • wing是什么_数独算法代码

    wing是什么_数独算法代码原题链接设有 N×N 的方格图,我们在其中的某些方格中填入正整数,而其它的方格中则放入数字0。如下图所示:某人从图中的左上角 A 出发,可以向下行走,也可以向右行走,直到到达右下角的 B 点。在走过的路上,他可以取走方格中的数(取走后的方格中将变为数字0)。此人从 A 点到 B 点共走了两次,试找出两条这样的路径,使得取得的数字和为最大。输入格式第一行为一个整数N,表示 N×N 的方格图。接下来的每行有三个整数,第一个为行号数,第二个为列号数,第三个为在该行、该列上所放的数。行和列编号从

    2022年8月9日
    5
  • 编译原理之文法

    编译原理之文法编译原理之文法

    2022年4月25日
    33
  • linux .vimrc设置 tab设置

    linux .vimrc设置 tab设置一.仅设置当前用户的Tab键宽度输入命令:vim~/.vimrc然后:settabstop=4 //我这里将Tab键的宽度设置为4保存:ctrl+z+z(或:wq!)OK!二.设置所有用户的Tab键宽度输入命令:vim/etc/vimrc在vimrc文件的最后添加:settabstop=4保存:ctrl+z+z(或:wq!)OK!这样不管是哪个用…

    2022年5月3日
    60
  • Spring c3p0连接池配置以及出错原因

    Spring c3p0连接池配置以及出错原因 用的jar包com.springsource.com.mchange.v2.c3p0-0.9.1.2.jar配置:注意:如果出错原因(1)很有可能c3p0-config.xml中的配置文件出现问题,比如我是因为把“driverClass”不小心写成了“driver”,             所以在书写c3p0-config.xml要特别小心,可能多一个空格或者格式稍有问题,都…

    2022年5月22日
    39
  • linux两个文件修改主机名

    linux修改主机名的方法用hostname命令可以临时修改机器名,但机器重新启动之后就会恢复原来的值。#hostname//查看机器名#hostname-i//查看本机器名对应的ip地址

    2021年12月24日
    37
  • 个人觉得好用的Xmind快捷键(mac)[通俗易懂]

    个人觉得好用的Xmind快捷键(mac)[通俗易懂]commandN新建脑图空格修改文字Delete删除文字commandZ撤销上一步Enter添加平行分支Tab添加子节点command+/-放大/缩小commandI上传图片command+Shift+H插入超链接command+1,2,3,4,5,6快速添加优先等级图标-收缩目前分支方向键展开当前分支…

    2022年6月5日
    73

发表回复

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

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