qwik边缘端渲染无法用pwa-node直接调试,因边缘运行时无node.js环境;应通过本地ssr模拟(npm run dev)配合pwa-node调试dist/server/entry.dev.ts或src/entry.dev.ts,并正确配置sourcemappathoverrides与prettier 3.0+。

Qwik 的边缘端渲染(如 Cloudflare Workers、Vercel Edge Functions)在 VSCode 中调试,不能直接用 pwa-node 调试本地 Node 进程——它跑在隔离的边缘运行时里,没有传统 Node.js 环境。你真正要调试的是 SSR 渲染逻辑,而它被包裹在适配器中(比如 @qwik-city/adapters/cloudflare-workers 或 @qwik-city/adapters/vercel-edge),最终由构建产物驱动。
为什么 launch.json 里 type=pwa-node 会失败
因为 pwa-node 只能 attach 到真实运行的 Node.js 进程(如 node dist/server/entry.dev.ts),但边缘环境根本不启动这个进程:Cloudflare Workers 用 Durable Objects + V8 Isolates,Vercel Edge 用 WebContainer-like 沙箱,它们不暴露 --inspect 端口,也不支持 sourcemap 的 Node-style 路径映射。
- 断点永远停在
webpack:///./src/...这类路径上,VSCode 找不到对应源文件 -
useSignal$、useServer$宏在边缘入口里是编译后形态(如__h调用),TS 类型已丢失,无法跳转或 hover 提示 - 即使强行用
node --inspect运行 adapter 入口,也只会执行“构建时模拟”,不是真实边缘行为,HMR 和热重载全失效
实际可行的调试路径:本地 SSR 模拟 + 构建产物检查
边缘项目调试的核心是「让本地开发服务器尽可能逼近边缘行为」,而不是试图远程 attach 到 Worker 实例。Qwik City 默认的 npm run dev 就是走这条路——它起一个 Express/Node 服务,但加载的是和边缘一致的 render() 函数和路由配置。
使用一条命令部署ProbeChain Rydberg测试网代理节点。自动注册为Agent(NodeType=1),免gas,支持macOS/Linux/Windows。触发词:/r
- 确保
tsconfig.json中compilerOptions.types包含"@builder.io/qwik",且jsx为"preserve",否则useClientEffect$等宏类型报错,连语法高亮都崩 - SSR 入口必须指向 Qwik City 的适配器导出,例如
dist/server/entry.dev.ts(Vite 构建后)或src/entry.dev.ts(开发模式下由 Qwik CLI 动态生成) -
.vscode/launch.json配置必须用"type": "pwa-node","program"指向上述入口,并设置"sourceMapPathOverrides"匹配构建输出前缀,例如:"webpack:///./src/*": "${webRoot}/src/*" - 启动前务必先执行
npm run dev(或pnpm dev),否则调试器找不到正在监听的进程;Qwik 的 dev server 启动后才暴露调试端口
Prettier 和宏格式化必须对齐,否则调试时代码已变形
Qwik 宏(如 useServer$)依赖 $ 符号在 AST 中的位置语义。Prettier 若解析错误,会把 useServer$ 拆成 useServer $ 或挪走注释,导致构建失败或断点移位。
- 必须升级到
prettier@3.0.0+,旧版(如 2.x)不识别 Qwik 宏语法 -
.prettierrc中必须显式写"parser": "typescript",禁用babel或flow - VSCode 工作区设置中关闭全局
editor.formatOnSave对typescriptreact的绑定,改用:"[typescriptreact]": { "editor.formatOnSave": true } - 临时绕过可用
// prettier-ignore,但只应在单行宏调用前加,长期滥用等于掩盖配置缺陷
真正难的不是配 launch.json,而是理解 Qwik 的构建分层:开发时的 dev 命令跑的是 Node SSR 模拟,部署时的 build 产出才是边缘可执行包。你在 VSCode 里能 debug 的只有前者——后者只能靠 console.log 注入、构建日志、以及边缘平台自己的 runtime 日志来验证。










