如何在webpack项目中调试loader插件
更新时间：2021年06月22日 10:09:59 作者：周磊爱学习
最近在学习webpack，本文主要介绍了loader插件的调试方法，需要的朋友们下面随着小编来一起学习学习吧
最近，在学习webpack使用时，发现webpack-replace-loader配置正则不起用，调试插件后才发现，search健值竟然不支持正则的写法，后有换成string-replace-loader插件，这个loader的search健值支持正则写法，问题得到解决。这里记录下loader的调试方法：
首先需要准备node环境
第一步：下载全局安装 node-nightly
npm install -g --save-dev node-nightly
第二步：添加调试命令
"node-nightly": "node-nightly --inspect-brk ./node_modules/webpack/bin/webpack.js",
第三步：命令行中运行 npm run node-nightly
第四步： 打开谷歌浏览器在url上输入 chrome://inspect/#devices
点击inspect 进入调试页面
第五步： 在vscode中的node_module里面找到loader的index.js文件，在module.exports函数里面加上debugger;
到此，可以按照平时调试js一样，调试对应loader脚本。
到此这篇关于如何在webpack项目中调试loader插件的文章就介绍到这了,更多相关webpack调试loader插件内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
这篇文章主要为大家详细介绍了js获取数组中的最大值的9种方法，以及每种方法的工作原理和用法，文中的示例代码讲解详细，需要的可以参考下2023-08-08
使用indexOf等在JavaScript的数组中进行元素查找和替换
使用slice、replace、indexOf等等在JavaScript的数组中进行元素的查找和替换，感兴趣的朋友可以学习下2013-09-09
Javascript中的对像赋值与Java中是一样的,都为引用传递.就是说,在把一个对像赋值给一个变量时,那么这个变量所指向的仍就是原来对像的地址.那怎么来做呢 答案是克隆.2008-12-12
这篇文章主要介绍了使用二维数组实现的省市联动菜单，通过二维数组存储城市列表项,需要的朋友可以参考下2014-05-05
这篇文章主要介绍了JS折半插入排序算法,以完整实例形式较为详细的分析了JavaScript实现折半插入排序的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-12-12
本节主要介绍了checkbox选中与未选中的判断方法，需要的朋友可以参考下2014-08-08
在JavaScript中，for-in和for-of是两种不同的循环结构，本文主要介绍了js中for-in和for-of的区别，具有一定的参考价值，感兴趣的可以了解一下2023-12-12
有效性验证的方法有很多，在本文将为大家介绍下如何使用js简单实现下，感兴趣的朋友可以参考下2013-10-10
这篇文章主要为大家详细介绍了如何分别使用Vue和JavaScript实现全选与反选功能,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下2024-04-04
Visual Studio Code (简称 VS Code / VSC) 是一款免费开源的现代化轻量级代码编辑器。这篇文章主要介绍了vsCode安装使用教程和插件安装方法,需要的朋友可以参考下2018-11-11
最新评论