VSCode中Rollup断点进不了src文件,因launch.json的sourceMaps/outFiles、rollup.config.js的output.sourcemap及输出格式/后缀三者未对齐;须用npx rollup -c启动,确保sourceMap启用且路径精确匹配。

VSCode 里 Rollup 调试断点进不了 src 文件?不是插件没装全,而是 launch.json 和 rollup.config.js 的 sourceMap 链路根本没对上。只要三处配错任意一个,VSCode 就只会停在 dist/bundle.js 里。
怎么让 rollup -c 在 VSCode 终端里跑起来不报 command not found
VSCode 默认终端不自动识别 node_modules/.bin 下的命令,尤其你用的是局部安装(npm install rollup --save-dev)。
- 永远用
npx rollup -c启动,它会精准调用项目本地版本,不依赖全局安装 - 在
package.json的scripts里加一条:"build": "rollup -c",然后用 Ctrl+Shift+P → “Tasks: Run Script” 触发,比手动输更稳、可复用 - 如果用了 TypeScript,确认
@rollup/plugin-typescript已安装,且tsconfig.json中"sourceMap": true和"declaration": false已启用(后者避免生成 .d.ts 干扰打包)
为什么断点只停在 dist/bundle.js,不进 src/
VSCode 调试器完全不读 rollup.config.js 里的 output.sourcemap,它只认 launch.json 里显式声明的映射路径和开关。
-
launch.json必须设"sourceMaps": true,且"outFiles"要精确匹配实际输出路径,比如output.file: 'dist/index.mjs',就得写成"${workspaceFolder}/dist/index.mjs",不能笼统写dist/**/*.js -
rollup.config.js中output.sourcemap必须是true或'inline',不能是false或字符串'hidden' - 若用
output.dir(如dist/),则outFiles得写成"${workspaceFolder}/dist/**/*.js",但必须确保 Rollup 真的输出了 .js 文件(有些插件可能输出 .mjs)
@rollup/plugin-node-resolve 在 VSCode 里到底起什么作用
它不参与打包逻辑本身,但在编辑阶段解决最烦人的红波浪线——即 import 第三方包时报 Cannot find module。
- 单独装这个插件只解决模块解析,不解决类型提示;要完整消除报错,还得配 TS 的
types声明(比如给lodash装@types/lodash) - 它和
@rollup/plugin-commonjs是黄金搭档:前者找包,后者把 CommonJS 格式转成 ES 模块,否则require()会直接报错 - 如果你只开发库、不引入 npm 包,这个插件可以不用——别为了“看起来完整”硬加
最容易被忽略的其实是 output.format 和 outFiles 的耦合:比如你设了 format: 'es',Rollup 默认输出 .mjs,但 launch.json 还在匹配 **/*.js,断点自然失效。格式、后缀、路径,三者必须咬死对齐。


















