Skip to content

Commit d34fd36

Browse files
author
Luca Forstner
authored
feat(nextjs): Add browser SDK to app directory browser bundle (#6812)
1 parent e357c90 commit d34fd36

File tree

21 files changed

+174
-57
lines changed

21 files changed

+174
-57
lines changed

packages/nextjs/src/config/webpack.ts

Lines changed: 9 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -500,12 +500,12 @@ function shouldAddSentryToEntryPoint(
500500
excludeServerRoutes: Array<string | RegExp> = [],
501501
isDev: boolean,
502502
): boolean {
503-
if (entryPointName === 'middleware') {
504-
return true;
505-
}
506-
507503
// On the server side, by default we inject the `Sentry.init()` code into every page (with a few exceptions).
508504
if (isServer) {
505+
if (entryPointName === 'middleware') {
506+
return true;
507+
}
508+
509509
const entryPointRoute = entryPointName.replace(/^pages/, '');
510510

511511
// User-specified pages to skip. (Note: For ease of use, `excludeServerRoutes` is specified in terms of routes,
@@ -527,23 +527,18 @@ function shouldAddSentryToEntryPoint(
527527
// versions.)
528528
entryPointRoute === '/_app' ||
529529
entryPointRoute === '/_document' ||
530-
// Newer versions of nextjs are starting to introduce things outside the `pages/` folder (middleware, an `app/`
531-
// directory, etc), but until those features are stable and we know how we want to support them, the safest bet is
532-
// not to inject anywhere but inside `pages/`.
533530
!entryPointName.startsWith('pages/')
534531
) {
535532
return false;
536533
}
537534

538535
// We want to inject Sentry into all other pages
539536
return true;
540-
}
541-
542-
// On the client side, we only want to inject into `_app`, because that guarantees there'll be only one copy of the
543-
// SDK in the eventual bundle. Since `_app` is the (effectively) the root component for every nextjs app, inclusing
544-
// Sentry there means it will be available for every front end page.
545-
else {
546-
return entryPointName === 'pages/_app';
537+
} else {
538+
return (
539+
entryPointName === 'pages/_app' || // entrypoint for `/pages` pages
540+
entryPointName === 'main-app' // entrypoint for `/app` pages
541+
);
547542
}
548543
}
549544

packages/nextjs/test/integration/.gitignore

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,3 +34,6 @@ yarn-error.log*
3434

3535
# vercel
3636
.vercel
37+
38+
# Generated by Next.js 13
39+
.vscode
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
export default function ({ children }: { children: React.ReactNode }) {
2+
return <>{children}</>;
3+
}
Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
'use client';
2+
3+
export default function () {
4+
return <p>I am a client component!</p>;
5+
}
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
export default function ({ children }: { children: React.ReactNode }) {
2+
return <>{children}</>;
3+
}
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
export default async function () {
2+
return <p>I am a server component!</p>;
3+
}
Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
const { withSentryConfig } = require('@sentry/nextjs');
2+
3+
// NOTE: This will be used by integration tests to distinguish between Webpack 4 and Webpack 5
4+
const moduleExports = {
5+
webpack5: %RUN_WEBPACK_5%,
6+
eslint: {
7+
ignoreDuringBuilds: true,
8+
},
9+
pageExtensions: ['jsx', 'js', 'tsx', 'ts', 'page.tsx'],
10+
sentry: {
11+
// Suppress the warning message from `handleSourcemapHidingOptionWarning` in `src/config/webpack.ts`
12+
// TODO (v8): This can come out in v8, because this option will get a default value
13+
hideSourceMaps: false,
14+
excludeServerRoutes: [
15+
'/api/excludedEndpoints/excludedWithString',
16+
/\/api\/excludedEndpoints\/excludedWithRegExp/,
17+
],
18+
},
19+
};
20+
21+
const SentryWebpackPluginOptions = {
22+
dryRun: true,
23+
silent: true,
24+
};
25+
26+
module.exports = withSentryConfig(moduleExports, SentryWebpackPluginOptions);
Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
const { withSentryConfig } = require('@sentry/nextjs');
2+
3+
// NOTE: This will be used by integration tests to distinguish between Webpack 4 and Webpack 5
4+
const moduleExports = {
5+
webpack5: %RUN_WEBPACK_5%,
6+
eslint: {
7+
ignoreDuringBuilds: true,
8+
},
9+
experimental: {
10+
appDir: Number(process.env.NODE_MAJOR) >= 16, // experimental.appDir requires Node v16.8.0 or later.
11+
},
12+
pageExtensions: ['jsx', 'js', 'tsx', 'ts', 'page.tsx'],
13+
sentry: {
14+
// Suppress the warning message from `handleSourcemapHidingOptionWarning` in `src/config/webpack.ts`
15+
// TODO (v8): This can come out in v8, because this option will get a default value
16+
hideSourceMaps: false,
17+
excludeServerRoutes: [
18+
'/api/excludedEndpoints/excludedWithString',
19+
/\/api\/excludedEndpoints\/excludedWithRegExp/,
20+
],
21+
},
22+
};
23+
24+
const SentryWebpackPluginOptions = {
25+
dryRun: true,
26+
silent: true,
27+
};
28+
29+
module.exports = withSentryConfig(moduleExports, SentryWebpackPluginOptions);
Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
1-
import { withSentry } from '@sentry/nextjs';
21
import { NextApiRequest, NextApiResponse } from 'next';
32

43
const handler = async (_req: NextApiRequest, res: NextApiResponse): Promise<void> => {
54
res.status(500).json({ statusCode: 500, message: 'Something went wrong' });
65
};
76

8-
export default withSentry(handler);
7+
export default handler;
Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
1-
import { withSentry } from '@sentry/nextjs';
21
import { NextApiRequest, NextApiResponse } from 'next';
32

43
const handler = async (_req: NextApiRequest, _res: NextApiResponse): Promise<void> => {
54
throw new Error('API Error');
65
};
76

8-
export default withSentry(handler);
7+
export default handler;

0 commit comments

Comments
 (0)