Skip to content

Add Turbopack sourcemap alias#1996

Merged
connor4312 merged 1 commit intomicrosoft:mainfrom
timneutkens:add/turbopack-sourcemap-alias
Apr 24, 2024
Merged

Add Turbopack sourcemap alias#1996
connor4312 merged 1 commit intomicrosoft:mainfrom
timneutkens:add/turbopack-sourcemap-alias

Conversation

@timneutkens
Copy link
Copy Markdown
Contributor

@timneutkens timneutkens commented Apr 24, 2024

What?

We got an issue report on the Next.js repository about the vscode debugger not automatically working with Turbopack enabled: vercel/next.js#63740.

Turbopack (website) is the new bundler we've been building, it supports sourcemaps by default and works really well with VS Code's debugger but requires additional configuration compared to using Next.js with webpack because the debugger has built-in handling of webpack paths like webpack://.

This PR aims to support Turbopack paths in the same way.

On the Turbopack side we have this open PR to add turbopack:// to the sourcemaps: vercel/next.js#64965

How?

Updated the sourceMapPathOverrides default to include the required path mapping for Turbopack. Similar to how Webpack and Meteor are handled there.

Open questions

Since I'm not familiar with this repository I could use some helping getting this over the line if it's not already good to land.

Specifically what's potentially missing is a test and the docs still need to be updated. It seems OPTIONS.md is auto-generated, should I run the script to generate it?

Thanks in advance!

'webpack://?:*/*': `${webRoot}/*`,
'webpack:///([a-z]):/(.+)': '$1:/$2',
'meteor://💻app/*': `${webRoot}/*`,
"turbopack://[project]/*": "${workspaceFolder}/*"
Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
"turbopack://[project]/*": "${workspaceFolder}/*"
"turbopack://[project]/*": "${workspaceFolder}/*",

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good. Please merge it in!

Copy link
Copy Markdown

@avianion avianion left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great PR!

'webpack://?:*/*': `${webRoot}/*`,
'webpack:///([a-z]):/(.+)': '$1:/$2',
'meteor://💻app/*': `${webRoot}/*`,
"turbopack://[project]/*": "${workspaceFolder}/*"
Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good. Please merge it in!

@avianion
Copy link
Copy Markdown

@Tyriar @rzhao271 Please merge this, it's a small change but very useful for Turbopack and nextjs users.

@connor4312
Copy link
Copy Markdown
Member

Please run npm run fmt and then npm run watch to get the file formatted and OPTIONS.md updated. Thanks!

@Tyriar
Copy link
Copy Markdown
Contributor

Tyriar commented Apr 24, 2024

@avianion pinging random people isn't necessary

@avianion
Copy link
Copy Markdown

@Tyriar ok bro

@Tyriar
Copy link
Copy Markdown
Contributor

Tyriar commented Apr 24, 2024

@avianion thanks bro

connor4312 added a commit that referenced this pull request Apr 24, 2024
@connor4312 connor4312 merged commit eada6e1 into microsoft:main Apr 24, 2024
@timneutkens
Copy link
Copy Markdown
Contributor Author

Thanks @connor4312 💯 Very helpful!

@connor4312
Copy link
Copy Markdown
Member

no problem, this will be out in the VS Code release next week

@timneutkens
Copy link
Copy Markdown
Contributor Author

Awesome, thank you!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants