Content-Length: 344294 | pFad | http://github.com/getsentry/sentry-javascript/issues/9787

8A Document how to handle `sideEffects` · Issue #9787 · getsentry/sentry-javascript · GitHub
Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Document how to handle sideEffects #9787

Closed
3 tasks done
Angelodaniel opened this issue Dec 8, 2023 · 7 comments · Fixed by getsentry/sentry-docs#13031
Closed
3 tasks done

Document how to handle sideEffects #9787

Angelodaniel opened this issue Dec 8, 2023 · 7 comments · Fixed by getsentry/sentry-docs#13031
Assignees
Labels
Package: nextjs Issues related to the Sentry Nextjs SDK Sync: Jira apply to auto-create a Jira shadow ticket Type: Documentation

Comments

@Angelodaniel
Copy link
Member

Angelodaniel commented Dec 8, 2023

Is there an existing issue for this?

How do you use Sentry?

Sentry Saas (sentry.io)

Which SDK are you using?

@sentry/nextjs

SDK Version

latest

Framework Version

next latest

Link to Sentry event

No response

SDK Setup

No response

Steps to Reproduce

It looks like sth. related to tree shaking in Webpack (https://webpack.js.org/guides/tree-shaking/)

It can be easily reproduced using even the latest next and @sentry/nextjs versions - e.g. via project created using npx create-next-app@latest; npx @Sentry/wizard@latest -i nextjs. With such a sample project created, all works as expected.

Interesting things start to happen, when you add "sideEffects": false to the package.json:
Both sentry.edge.config.(js|ts) and sentry.server.config.(js|ts) seem to be completely ignored - the content of both could be only throw new Error(); - these won't even be loaded. However, if you remove any, the Webpack plugin will complain about the missing file(s).

In my initial message I have mentioned that the API route errors are reported to Sentry - it looks like, however, it was due to the Next's Error Overlay being displayed and @sentry/browser jumping in.

I had the "sideEffects": false entry in my project's package.json for some long time already - it was actually resulting in my app client bundle files size being smaller by ~10kb due to a better tree shaking on my project's dependencies. I do not, however, see the same in the sample project created above. It's not affecting Sentry running in the browser - here all works as expected.
The 'solution' to the issue is to remove "sideEffects": false from package.json, or at least change it to the following:

"sideEffects": [
  "./sentry.client.config.*s",
  "./sentry.edge.config.*s",
  "./sentry.server.config.*s"
]

I would, however, expect the Sentry Webpack plugin does it automatically (i.e. prevents these files being shaken out).
Or, at least, Sentry documentation mentions this trap...

Expected Result

I would, however, expect the Sentry Webpack plugin does it automatically (i.e. prevents these files being shaken out).

Actual Result

package.json includes "sideEffects": false, the Sentry Webpack plugin appears to ignore certain configuration files (sentry.edge.config.(js|ts) and sentry.server.config.(js|ts)). Even if the content of these files is set to something simple like throw new Error();, they are not loaded, and removing any of these files results in a Webpack plugin complaint about missing files.

Additionally, the report notes that API route errors are reported to Sentry, possibly due to Next.js Error Overlay being displayed and @sentry/browser jumping in. Despite these issues, the Sentry Webpack plugin seems to work as expected in the browser, indicating a specific problem when sideEffects is set to false in the project's configuration.

┆Issue is synchronized with this Jira Improvement by Unito

@getsantry getsantry bot moved this to Waiting for: Product Owner in GitHub Issues with 👀 Dec 8, 2023
@github-actions github-actions bot added the Package: nextjs Issues related to the Sentry Nextjs SDK label Dec 8, 2023
@Angelodaniel Angelodaniel added the Sync: Jira apply to auto-create a Jira shadow ticket label Dec 8, 2023
@lforst
Copy link
Member

lforst commented Dec 11, 2023

I don't want to fully dismiss this but I also want to say that setting sideEffects: false is wrong when you use the Sentry SDK, as the SDK is essentially one big side-effect. The Sentry.init() calls being tree-shaken out is probably even correct behaviour when sideEffects is set to false.

I am not aware of anything we can do here on a webpack level - if anybody has suggestions, I am fully open to them. Setting sideEffects: false is not the default and setting it should be thoroughly thought through. IMO it is unusual to set it inside an app that is not consumed by anything else and I wouldn't recommend it because it can introduce weird behaviours (like this one).

If anything, we could add docs for this.

@jpulec
Copy link
Contributor

jpulec commented Jan 25, 2024

I'd just like to add that I lost days of my life trying to figure out why our app wasn't reporting to Sentry, but only in the server and edge runtimes, until I found this issue. Maybe add some docs around this to the troubleshooting section?

@getsantry getsantry bot moved this to Waiting for: Product Owner in GitHub Issues with 👀 2 Jan 25, 2024
@lforst
Copy link
Member

lforst commented Jan 25, 2024

@jpulec Fair suggestion. Where would you have put the docs exactly so you would have seen it? Also, if you don't mind me asking, why did you add sideEffect: false in the first place?

@jpulec
Copy link
Contributor

jpulec commented Jan 26, 2024

The first place I went looking when I was having problems was the Troubleshooting Section here. I was hoping that this might have been some sort of more common case, since it seemed so obviously broken to me.

Re: sideEffects, I have it set to sideEffects: ['*.css', '*.scss'], This is done to prune files from our bundle if they are unused. We use a lot of barrel files, which means that without this, we'd basically include all source files, even if they are unused, since they're probably imported somewhere in our dependency graph. Probably not an ideal project structure, but it's where we are today.

@getsantry getsantry bot moved this to Waiting for: Product Owner in GitHub Issues with 👀 2 Jan 26, 2024
@lforst
Copy link
Member

lforst commented Jan 29, 2024

@jpulec Thank you. I'll make sure it will get added to the docs after our Next.js migration this week!

@NachoLZ
Copy link

NachoLZ commented Oct 16, 2024

Had this problem with remix, it wasnt reporting with the sourcemaps, had to do:
"sideEffects": [
"./instrumentation.server.mjs"
],

@getsantry getsantry bot moved this to Waiting for: Product Owner in GitHub Issues with 👀 3 Oct 16, 2024
@andreiborza
Copy link
Member

@NachoLZ thanks for writing in, we'll likely add this to our docs.

@linear linear bot added the Migrated label Jan 9, 2025
@mydea mydea changed the title Sentry Webpack Plugin Ignores Configuration Files with "sideEffects": false Document how to handle sideEffects Mar 18, 2025
@lforst lforst self-assigned this Mar 18, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Package: nextjs Issues related to the Sentry Nextjs SDK Sync: Jira apply to auto-create a Jira shadow ticket Type: Documentation
Projects
Archived in project
Archived in project
Archived in project
Development

Successfully merging a pull request may close this issue.

7 participants








ApplySandwichStrip

pFad - (p)hone/(F)rame/(a)nonymizer/(d)eclutterfier!      Saves Data!


--- a PPN by Garber Painting Akron. With Image Size Reduction included!

Fetched URL: http://github.com/getsentry/sentry-javascript/issues/9787

Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy