详解webpack打包后如何调试的方法步骤


Posted in Javascript onNovember 07, 2018

webpack.config.js

在配置devtool时,webpack给我们提供了四种选项

  1. source-map:在一个单独文件中产生一个完整且功能完全的文件。这个文件具有最好的source map,但是它会减慢打包速度;
  2. cheap-module-source-map:在一个单独的文件中产生一个不带列映射的map,不带列映射提高了打包速度,但是也使得浏览器开发者工具只能对应到具体的行,不能对应到具体的列(符号),会对调试造成不便。
  3. eval-source-map:使用eval打包源文件模块,在同一个文件中生产干净的完整版的sourcemap,但是对打包后输出的JS文件的执行具有性能和安全的隐患。在开发阶段这是一个非常好的选项,在生产阶段则一定要不开启这个选项。
  4. cheap-module-eval-source-map:这是在打包文件时最快的生产source map的方法,生产的 Source map 会和打包后的JavaScript文件同行显示,没有影射列,和eval-source-map选项具有相似的缺点。

配置开发环境

module.exports = {
 devtool: 'source-map',
 entry:"",
 output: {
 }
 ....
}

详解webpack打包后如何调试的方法步骤

不配置开发环境

没有webpack选项

详解webpack打包后如何调试的方法步骤

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript String 对象
Apr 25 Javascript
可在线编辑网页文字效果代码(单击)
Mar 02 Javascript
JQuery中DOM事件冒泡实例分析
Jun 13 Javascript
详解JavaScript中的事件流和事件处理程序
May 20 Javascript
Javascript中级语法快速入手
Jul 30 Javascript
jQuery数组处理函数整理
Aug 03 Javascript
JS中用三种方式实现导航菜单中的二级下拉菜单
Oct 31 Javascript
清除js缓存的多种方法总结
Dec 09 Javascript
js实现简单的计算器功能
Jan 16 Javascript
JavaScript实现的鼠标响应颜色渐变效果完整实例
Feb 18 Javascript
vue.js 实现点击展开收起动画效果
Jul 07 Javascript
Vue+elementUI实现多图片上传与回显功能(含回显后继续上传或删除)
Mar 23 Javascript
微信小程序列表中item左滑删除功能
Nov 07 #Javascript
Angular 实现输入框中显示文章标签的实例代码
Nov 07 #Javascript
VueCli3构建TS项目的方法步骤
Nov 07 #Javascript
vue调试工具vue-devtools安装及使用方法
Nov 07 #Javascript
vue+webpack中配置ESLint
Nov 07 #Javascript
利用jqgrid实现上移下移单元格功能
Nov 07 #Javascript
React 源码中的依赖注入方法
Nov 07 #Javascript
You might like
浅析PHP程序设计中的MVC编程思想
2014/07/28 PHP
PHP使用正则表达式实现过滤非法字符串功能示例
2018/06/04 PHP
用javascript实现自定义标签
2007/05/08 Javascript
javascript 动态添加事件代码
2008/11/30 Javascript
javascript学习笔记(二十) 获得和设置元素的特性(属性)
2012/06/20 Javascript
3种Jquery限制文本框只能输入数字字母的方法
2014/12/03 Javascript
JavaScript创建闭包的两种方式的优劣与区别分析
2015/06/22 Javascript
JavaScript ParseFloat()方法
2015/12/18 Javascript
AngularJS ng-bind 指令简单实现
2016/07/30 Javascript
JS实现页面中所有img对象添加onclick事件及新窗口查看图片的方法
2016/12/27 Javascript
纯js实现页面返回顶部的动画(超简单)
2017/08/10 Javascript
详解 vue better-scroll滚动插件排坑
2018/02/08 Javascript
Angular5集成eventbus的示例代码
2018/07/19 Javascript
通过vue-cli3构建一个SSR应用程序的方法
2018/09/13 Javascript
VSCode 添加自定义注释的方法(附带红色警戒经典注释风格)
2020/08/27 Javascript
python使用PyFetion来发送短信的例子
2014/04/22 Python
Python学习教程之常用的内置函数大全
2017/07/14 Python
python内置函数:lambda、map、filter简单介绍
2017/11/16 Python
Python redis操作实例分析【连接、管道、发布和订阅等】
2019/05/16 Python
怎么快速自学python
2020/06/22 Python
python如何提升爬虫效率
2020/09/27 Python
python 实现简单的计算器(gui界面)
2020/11/11 Python
通过css3动画和opacity透明度实现呼吸灯效果
2019/08/09 HTML / CSS
Artist Guitars新西兰:乐器在线商店
2017/09/17 全球购物
成功经营餐厅的创业计划书范文
2013/12/26 职场文书
财务担保书范文
2014/04/02 职场文书
高一学生期末评语
2014/04/25 职场文书
本科应届生自荐信
2014/06/29 职场文书
2015年三八妇女节活动总结
2015/02/06 职场文书
党员承诺书格式范文
2015/04/28 职场文书
运动会广播稿100字
2015/08/19 职场文书
2015年美容师个人工作总结
2015/10/14 职场文书
导游词之上海豫园
2019/10/24 职场文书
详解NodeJS模块化
2021/06/15 NodeJs
电脑开机弹出documents文件夹怎么回事?弹出documents文件夹解决方法
2022/04/08 数码科技
Python如何利用pandas读取csv数据并绘图
2022/07/07 Python