@sentry/nextjs Webpack 5 code duplication bug

• Review the documentation: https://docs.sentry.io/
• Search for existing issues: https://github.com/getsentry/sentry-javascript/issues
• Use the latest release: https://github.com/getsentry/sentry-javascript/releases
• Provide a link to the affected event from your Sentry account

Package + Version

• @sentry/browser
• @sentry/node
• raven-js
• raven-node (raven for node)
• other: @sentry/nextjs

Version:

6.4.1

Description

During the process of upgrading one of our next.js applications from webpack 4 to webpack 5 I stumbled upon a bug where using withSentryConfig causes webpack 5 to duplicate dependencies in the final output. Using the webpack bundle analyzer I can see that packages normally bundled in _app also get their own shared bundle

Without withSentryConfig:

Using withSentryConfig: (Notice that @apollo/client is now included in both _app and the 675- bundle)

I’ve created a simple app using the with-apollo template that reproduces the issue: https://github.com/pgrippi/sentry-nextjs-code-duplication-bug.

You can modify next.config.js, swapping the module.exports statements and running yarn build to see the bundle output difference

To clarify the issue not limited to @apollo/client, it looks like most modules imported from npm that appear in both _app and other pages get duplicated, the apollo client is just very noticeable given its large footprint

[lobsterkatie]

What @tm1000 said. 🙂

Also, @steida, you’re not wrong - it is a comparatively big library, and one of our goals for v7 is to reduce the bundle size. The way it’s currently written makes it not very tree-shakable (we use classes a lot, for instance), and we aim to fix that, among other things.

Glad the update fixed things! Nothing like investigating a bug and discovering you’ve unknowingly fixed it after unknowingly introducing it in the first place…

[lobsterkatie]

@pgrippi @travisbloom @adrienrn @steida Can you all please try upgrading to @sentry/nextjs 6.5.0 or greater? I believe I understand the cause of this bug, and if I do, then it’s fixed in that version.

More specifically, https://github.com/getsentry/sentry-javascript/pull/3625 (which is included in https://github.com/getsentry/sentry-javascript/pull/3580) fixed a bug where the webpack entry property was incorrectly converted to a promise, rather than a function which returns a promise. As a result, this code was broken - originalEntry wasn’t a function, so it wasn’t awaited, and therefore never turned into a real value; the promise that it remained didn’t have the keys necessary for the final for-loop; and therefore none of the dependsOn code (which would have factored the duplication out) could run.

Can y’all please let me know if upgrading works for you?