Skip to content

Bug: Breakpoints fail to attach in VSCode when autoCodeSplitting is enabled #6667

@pillarcoin

Description

@pillarcoin

Which project does this relate to?

Router

Describe the bug

When using @tanstack/router-plugin (Vite) with autoCodeSplitting: true, VSCode's debugger is unable to attach breakpoints to .tsx files within the routes directory.

The breakpoints appear as "Unbound breakpoint" (gray hollow circles) when the debug session starts. If I set autoCodeSplitting: false, the breakpoints work perfectly.

I am unsure whether debugging with breakpoints is expected to be supported when autoCodeSplitting is enabled. However, if it is intended to work, the current transformation seems to break the source map mapping in VSCode.

Your Example Website or App

https://github.com/pillarcoin/tanstack-router-demo

Steps to Reproduce the Bug or Issue

  1. Open the project in VS Code.
  2. Run pnpm run dev and launch the "debug client-side" task from launch.json.
  3. Set a breakpoint at line 9 of src/routes/about.tsx.
  4. In the browser, click the "About" link.

Expected behavior

Breakpoints should be correctly mapped to the original source files even when code splitting transformation is applied by the plugin.

Screenshots or Videos

Image

Platform

  • Router / Start Version: 1.160.0
  • OS: macOS
  • Browser: Chrome
  • Browser 145.0.7632.76
  • Bundler: Vite
  • Bundler Version: 7.3.1

  • Node.js Version: v24.13.1
  • pnpm Version: 10.29.3

Additional context

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions