diff --git a/packages/nextjs/src/config/webpack.ts b/packages/nextjs/src/config/webpack.ts index 387d3344b8e8..8e697ac0a317 100644 --- a/packages/nextjs/src/config/webpack.ts +++ b/packages/nextjs/src/config/webpack.ts @@ -82,13 +82,22 @@ export function constructWebpackConfigFunction( if (userSentryOptions.autoInstrumentServerFunctions !== false) { const pagesDir = newConfig.resolve?.alias?.['private-next-pages'] as string; + // Next.js allows users to have the `pages` folder inside a `src` folder, however "`src/pages` will be ignored + // if `pages` is present in the root directory" + // - https://nextjs.org/docs/advanced-features/src-directory + const shouldIncludeSrcDirectory = !fs.existsSync(path.resolve(projectDir, 'pages')); + // Default page extensions per https://github.com/vercel/next.js/blob/f1dbc9260d48c7995f6c52f8fbcc65f08e627992/packages/next/server/config-shared.ts#L161 const pageExtensions = userNextConfig.pageExtensions || ['tsx', 'ts', 'jsx', 'js']; const pageExtensionRegex = pageExtensions.map(escapeStringForRegex).join('|'); newConfig.module.rules.push({ // Nextjs allows the `pages` folder to optionally live inside a `src` folder - test: new RegExp(`${escapeStringForRegex(projectDir)}(/src)?/pages/.*\\.(${pageExtensionRegex})`), + test: new RegExp( + `${escapeStringForRegex(projectDir)}${ + shouldIncludeSrcDirectory ? '/src' : '' + }/pages/.*\\.(${pageExtensionRegex})`, + ), use: [ { loader: path.resolve(__dirname, 'loaders/proxyLoader.js'), diff --git a/packages/nextjs/test/integration/src/pages/someNamedComponent.tsx b/packages/nextjs/test/integration/src/pages/someNamedComponent.tsx new file mode 100644 index 000000000000..c6b4a0859769 --- /dev/null +++ b/packages/nextjs/test/integration/src/pages/someNamedComponent.tsx @@ -0,0 +1,6 @@ +export const MyNamedPage = () => ( +

+ This page exists to test the compatibility of our auto-wrapper with the option of having the `pages` directory + inside a `src` directory (https://nextjs.org/docs/advanced-features/src-directory) +

+);