Sublime Text安装Web Inspector插件调试浏览器网页的方法-sublime-PHP中文网

chrome必须显式启动--remote-debugging-port=9222，否则sublime web inspector无法连接；需关闭所有chrome进程后用命令行启动，并确保swi.sublime-settings中chrome_remote_port与启动端口一致，且sourcemap正确映射。

sublime text安装web inspector插件调试浏览器网页的方法

Chrome 必须显式带 --remote-debugging-port=9222 启动，否则 Sublime Web Inspector 一定连不上——这不是配置问题，是协议连接前提被跳过了。

Chrome 启动参数必须手动指定端口

Sublime Web Inspector 不是独立调试器，它只是 Chrome DevTools Protocol（CDP）的前端界面，启动后会直接尝试 WebSocket 连接 localhost:9222。Chrome 默认完全不开启这个端口，所以“点击 SWI: Start Debugging 没反应”或报 No targets found，90% 是因为 Chrome 没带参数启动。

务必先关掉所有 Chrome 进程（包括任务栏右下角隐藏的实例），再用命令行启动
Windows：chrome.exe --remote-debugging-port=9222 --user-data-dir=C:\temp\swi
macOS：/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --remote-debugging-port=9222 --user-data-dir=/tmp/swi
Linux：google-chrome --remote-debugging-port=9222 --user-data-dir=/tmp/swi
验证是否生效：浏览器访问 http://localhost:9222/json，能看到 JSON 数组就表示通了

`swi.sublime-settings` 配置项必须严格匹配启动参数

插件读取配置后直接发起连接，写错一个字符（比如多空格、端口写成 92222 或 9223）就会静默失败，且几乎不报错。

Comet AI 浏览器

下载 Comet AI 浏览器，体验由 Perplexity AI 驱动的革命性上网方式。内置 AI 助手可实时总结网页、跨标签页对比信息、自动执行任务。告别繁琐操作，让 AI 成为你的浏览副驾，大幅提升研究与工作效率。支持 Windows、macOS、Android 和 iOS。

下载

chrome_remote_port：必须和启动 Chrome 时的端口号完全一致（默认是 9222）
chrome_executable：macOS/Linux 上不能填 Google Chrome，要填绝对路径，例如 /Applications/Google Chrome.app/Contents/MacOS/Google Chrome
reload_on_save 设为 true 时，只对当前已打开的目标 tab 生效；页面没打开就保存 JS，不会刷新，也不会报错——建议初期设为 false
debug_mode 设为 true 可在 Sublime 控制台看到连接日志，排查连不上时必开

断点只在 sourceMap 映射正确的原始代码上生效

你在 Sublime 里点的行号，必须能通过 sourceMap 正确映射到 Chrome 实际执行的 JS 位置，否则断点根本不会触发。

TS/webpack/babel 编译后的 JS 文件末尾必须有 //# sourceMappingURL=xxx.js.map 注释
map 文件路径要可访问：部署后常因未上传、路径写错或 Nginx 未配 location 导致 404
Chrome DevTools 设置里必须勾选 Settings → Preferences → Sources → Enable JavaScript source maps
如果用了构建工具，确认开启了 devtool: 'source-map'（webpack）或 sourceMaps: true（tsc）

真正卡住人的地方不是插件装没装上，而是 Chrome 端口、配置项、sourceMap 三者中任意一环没对齐——它们之间没有容错，错一个就全链路断掉，而且错误提示极弱。调试前花两分钟核对这三项，比反复重启 Sublime 有效得多。