前言
在前端开发中，有时候需要查看变量或者函数的执行情况，以及排查一些问题，这时候我们就需要一个调试工具，本文将介绍一个轻量级调试工具——@huangchaowh/locus。
什么是 @huangchaowh/locus？
@huangchaowh/locus 是一款快速定位调用函数位置的工具，可以过滤指定的文件和模块，并且使用简单，可以提高调试效率。它是基于 Node.js 开发的 npm 包，适用于前端项目的调试，可以避免繁琐的手动调试过程。
安装
使用 npm 进行安装：
npm install @huangchaowh/locus
如何使用？
- 引入包
在需要使用的文件中，引入 @huangchaowh/locus：
const locus = require('@huangchaowh/locus');- 定位代码
在需要调试的代码行后面添加 locus()，如：
console.log('Hello, World!');
locus();- 启动调试
在命令行中运行启动脚本：
node --inspect-brk=9229 [your_script_name]
其中 “9229” 是端口号，可以根据需要修改。使用浏览器打开 DevTools，选择 Node，即可看到断点停留在添加的调试代码处。
- 调试
可以在 DevTools 中查看变量值，使用 Step Over、Step Into、Step Out 控制代码运行，定位问题。
高级用法
除了基本的使用方式，@huangchaowh/locus 还支持一些高级功能。比如，过滤需要调试的文件和模块。
- 过滤文件
如果只需要调试特定的文件，可以在启动脚本中添加参数：
node --inspect-brk=9229 [your_script_name] --locusFilter **/file_to_filter.js
其中 “file_to_filter.js” 是需要过滤的文件名。使用 ** 表示通配符，可以匹配当前目录及其子目录中的文件。
- 过滤模块
如果只需要调试特定的模块，可以在启动脚本中添加参数：
node --inspect-brk=9229 [your_script_name] --locusFilter @module_name
其中 “module_name” 是需要过滤的模块名。使用 @ 表示只过滤该模块。
总结
@huangchaowh/locus 是一款轻量级的前端调试工具，可以快速定位代码位置，提高调试效率。在实际开发中，经常会遇到需要调试的情况，这时候可以考虑使用这个工具，可以避免繁琐的手动调试过程。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066bbf967216659e244140