Linux环境下JS调试方法

Linux环境下JS调试方法

一、核心工具与适用场景

说到Linux下的Ja vaScript调试，工具其实不少，但每个场景都有它最趁手的那个。先把核心的几个拎出来，后面再细说怎么用。

• Node.js内置调试：通过node inspect或node --inspect / --inspect-brk启动，可以配合Chrome DevTools或者命令行调试器做断点、单步、表达式观察。这套方案最适合命令行脚本、后端服务、CLI工具这类场景。
• VS Code调试：直接在编辑器里点Run and Debug启动，图形化的断点、条件断点、变量和调用栈查看，日常开发用起来最顺手。
• Chrome DevTools与远程调试：不管是前端页面还是Node.js，都可以通过chrome://inspect接入。无头或远程环境可以用--remote-debugging-port=9222暴露调试端口，通过WebSocket和Chrome DevTools Protocol（CDP）实现远程或自动化调试。
• 日志与问题定位：合理用好console和日志库（比如winston、morgan、bunyan），配合tail -f、ELK等工具做聚合分析，能快速还原问题现场。

二、快速上手步骤

实际动手调试时，记不住那么多命令没关系，把这几个常见的流程走一遍，后面就熟能生巧了。

使用Node.js内置调试

1. 启动：
   • 交互式调试：node inspect app.js
   • 远程接入：node --inspect app.js（如果想在首行暂停，用node --inspect-brk app.js）
2. 在Chrome打开chrome://inspect，在Remote Target中点击Inspect进入DevTools。
3. 在DevTools的Sources面板设置断点，使用Step Over/Into/Out，观察Scope与Console。
4. 命令行调试常用命令：c（continue）、n（next）、s（step in）、o（step out）、repl（进入REPL）、watch('expr')（监视表达式）。

使用VS Code调试

1. 打开项目，点击左侧Run and Debug，创建launch.json。
2. 使用以下配置并启动。注意skipFiles这里把Node内部模块跳过，避免调试时干扰太多。

   {
     "version": "0.2.0",
     "configurations": [
       {
         "type": "node",
         "request": "launch",
         "name": "Launch Program",
         "program": "${workspaceFolder}/app.js",
         "skipFiles": ["/**"]
       }
     ]
   }

3. 在代码行号左侧点击设断点，按F5启动，利用调试控制台评估表达式和查看变量。

三、远程与无头环境调试

生产环境不放桌面，容器里跑的服务怎么调试？远程调试的套路需要单独掌握。

远程调试Chrome标签页（同一台Linux主机或可控环境）

1. 启动带调试端口的Chrome：google-chrome --remote-debugging-port=9222
2. 访问chrome://inspect/#devices，在Configure中添加localhost:9222，即可发现并Inspect目标页面。

远程调试Node.js（服务器/容器/无头环境）

1. 启动应用：node --inspect-brk=9229 app.js
2. 在本地Chrome打开chrome://inspect，在Remote Target中连接并调试。
3. 无头/CI场景可以用Puppeteer启动Chromium并获取WebSocket调试地址（例如ws://127.0.0.1:…/devtools/browser/…），实现自动化或远程接入。

安全提示：开放9222/9229等端口时，务必限制来源IP、使用认证或SSH隧道，避免暴露到公网。

四、日志与问题定位技巧

调试不是只有断点，很多时候日志才是真相。尤其在生产环境，断点用不上，日志就是最可靠的武器。

• 增强日志可读性：用console.error()/warn()/info()分层输出；用console.time('label') / console.timeEnd('label')做性能对比；必要时使用debug模块按命名空间开关日志。
• 生产定位：确保生成了Source Map，在DevTools的Sources面板能映射回原始源码。结合条件断点、DOM断点与异常断点精确定位。
• 日志文件与实时查看：将日志写入文件，使用tail -f /path/to.log实时跟踪。大型项目建议引入winston/morgan/bunyan做结构化与分级日志。
• 环境与依赖：核对环境变量/配置是否正确；必要时回退或升级依赖版本以规避已知问题。

五、常见问题与排查清单

调试时候最怕的就是连不上、断不住。遇到问题别慌，按这个清单排查一遍，多半能搞定。

• 看不到Remote Target：确认应用已以--inspect启动；使用--inspect-brk时请确认进程已暂停并等待调试器接入；检查9222/9229端口占用与防火墙策略。
• 断点未命中：确认Source Map正确加载；检查skipFiles配置是否屏蔽了依赖包；前端代码是否经过打包导致行号偏移。
• 无法连接远程Chrome：使用--remote-debugging-port=9222启动目标浏览器；在chrome://inspect的Configure中正确填写localhost:9222；如果环境是容器或远程主机，确保端口转发或SSH隧道可达。
• 多进程/子进程：子进程不会自动附加，需要在子进程启动命令中也加入--inspect，或者使用ndb等工具增强多进程调试体验。