vscode配置rollup调试需三处对齐:node命令可用、rollup正确输出sourcemap、launch.json中outfiles路径与rollup.config.js输出严格匹配;任一错位则断点卡在dist/bundle.js。

VSCode 里配 Node + Rollup 不是装几个插件就完事,关键在三处对齐:Node 命令能跑起来、Rollup 能正确输出 sourcemap、VSCode 调试器能按路径找到它。错一个,断点就卡在 dist/bundle.js 里出不来。
确保 node 和 npm 在 VSCode 终端可用
VSCode 默认终端不自动加载系统 PATH(尤其 Windows 下的 PowerShell 或 Git Bash),常出现 command not found: node 或 npm 报错。
- 先在系统终端(非 VSCode)运行
node -v和npm -v确认已安装;没输出就重装 Node.js,勾选「Add to PATH」 - VSCode 中打开命令面板(
Ctrl+Shift+P),搜「Terminal: Select Default Profile」,选带Command Prompt或PowerShell的,别用 WSL(除非你明确配置了 WSL 的 Node) - 重启 VSCode 终端(关闭再开),再输
node -v—— 成功才有后续
npx rollup -c 是唯一安全的启动方式
本地安装 rollup(npm install rollup --save-dev)后,直接敲 rollup -c 会失败,因为 VSCode 终端不自动识别 node_modules/.bin/rollup。
使用一条命令部署ProbeChain Rydberg测试网代理节点。自动注册为Agent(NodeType=1),免gas,支持macOS/Linux/Windows。触发词:/r
- 永远用
npx rollup -c:它强制走项目本地版本,无视全局安装状态 - 在
package.json里加脚本:"scripts": { "build": "rollup -c", "dev": "rollup -c -w" } - 用
Ctrl+Shift+P→ 「Tasks: Run Script」选build,比手动输更稳,还能复用 - 如果用了 TypeScript,确认
@rollup/plugin-typescript已装,且tsconfig.json中"sourceMap": true开启
launch.json 必须和 rollup.config.js 的输出路径严格匹配
断点进不了 src/?不是插件没装,而是 VSCode 调试器根本不读 rollup.config.js 里的配置,只认 launch.json 显式写的路径。
-
launch.json里必须有:"sourceMaps": true、"outFiles"精确指向实际生成的 JS 文件(比如output.file: 'dist/index.mjs',就得写"${workspaceFolder}/dist/index.mjs") -
rollup.config.js中output.sourcemap必须是true或'inline',不能是false或'hidden' - 注意
output.format影响后缀:设format: 'es'默认输出.mjs,但outFiles写成**/*.js就匹配不上 - 如果用
output.dir: 'dist',确保 Rollup 真输出了.js(某些插件如@rollup/plugin-terser可能改后缀)
哪些 Rollup 插件真影响 VSCode 编辑体验
多数插件只在打包时起作用,对编辑器红波浪线、补全、跳转没帮助。真正有用的就这几个:
-
@rollup/plugin-node-resolve:解决import _ from 'lodash'的红波浪线,但需配合@types/lodash才有类型提示 -
@rollup/plugin-typescript:提供 TS 类型检查 + 补全,前提是tsconfig.json的include包含src/**/* -
@rollup/plugin-commonjs:仅当你import的 npm 包是 CommonJS 格式(比如早期的moment)时才需要,否则不用 - 像
rollup-plugin-terser、rollup-plugin-filesize这类纯构建优化插件,在 VSCode 里完全无感,装了也不影响编辑
最容易被忽略的是 output.format 和 outFiles 后缀的耦合——格式变了,路径没同步更新,断点就彻底失效。










