From 945bbd435f8a61f00ef1231791a26ffa693fd037 Mon Sep 17 00:00:00 2001 From: Katie Byers Date: Thu, 20 Jan 2022 16:01:57 -0800 Subject: [PATCH 1/2] add option to use `hidden-source-map` --- packages/nextjs/src/config/types.ts | 1 + packages/nextjs/src/config/webpack.ts | 3 +-- packages/nextjs/test/config.test.ts | 13 +++++++++++++ 3 files changed, 15 insertions(+), 2 deletions(-) diff --git a/packages/nextjs/src/config/types.ts b/packages/nextjs/src/config/types.ts index 77b7316ed0ca..9b45595c0c5f 100644 --- a/packages/nextjs/src/config/types.ts +++ b/packages/nextjs/src/config/types.ts @@ -20,6 +20,7 @@ export type NextConfigObject = { sentry?: { disableServerWebpackPlugin?: boolean; disableClientWebpackPlugin?: boolean; + hideSourceMaps?: boolean; }; } & { // other `next.config.js` options diff --git a/packages/nextjs/src/config/webpack.ts b/packages/nextjs/src/config/webpack.ts index 180cc1476325..68a73b91d818 100644 --- a/packages/nextjs/src/config/webpack.ts +++ b/packages/nextjs/src/config/webpack.ts @@ -77,12 +77,11 @@ export function constructWebpackConfigFunction( if (enableWebpackPlugin) { // TODO Handle possibility that user is using `SourceMapDevToolPlugin` (see // https://webpack.js.org/plugins/source-map-dev-tool-plugin/) - // TODO Give user option to use `hidden-source-map` ? // Next doesn't let you change this is dev even if you want to - see // https://github.com/vercel/next.js/blob/master/errors/improper-devtool.md if (!buildContext.dev) { - newConfig.devtool = 'source-map'; + newConfig.devtool = userNextConfig.sentry?.hideSourceMaps ? 'hidden-source-map' : 'source-map'; } newConfig.plugins = newConfig.plugins || []; diff --git a/packages/nextjs/test/config.test.ts b/packages/nextjs/test/config.test.ts index c53143c59a0e..e5d0aa682f20 100644 --- a/packages/nextjs/test/config.test.ts +++ b/packages/nextjs/test/config.test.ts @@ -300,6 +300,19 @@ describe('webpack config', () => { expect(finalWebpackConfig).toEqual(expect.objectContaining(materializedUserWebpackConfig)); }); + it('allows for the use of `hidden-source-map` as `devtool` value', async () => { + const userNextConfigHiddenSourceMaps = { ...userNextConfig, sentry: { ...userNextConfig.sentry } }; + userNextConfigHiddenSourceMaps.sentry.hideSourceMaps = true; + + const finalWebpackConfig = await materializeFinalWebpackConfig({ + userNextConfig: userNextConfigHiddenSourceMaps, + incomingWebpackConfig: serverWebpackConfig, + incomingWebpackBuildContext: serverBuildContext, + }); + + expect(finalWebpackConfig.devtool).toEqual('hidden-source-map'); + }); + describe('webpack `entry` property config', () => { const serverConfigFilePath = `./${SERVER_SDK_CONFIG_FILE}`; const clientConfigFilePath = `./${CLIENT_SDK_CONFIG_FILE}`; From 6fe684bc426f26164b367443ed517715deadb575 Mon Sep 17 00:00:00 2001 From: Katie Byers Date: Fri, 21 Jan 2022 10:23:52 -0800 Subject: [PATCH 2/2] only apply option to client-side builds --- packages/nextjs/src/config/webpack.ts | 10 ++++++++-- packages/nextjs/test/config.test.ts | 13 ++++++++++--- 2 files changed, 18 insertions(+), 5 deletions(-) diff --git a/packages/nextjs/src/config/webpack.ts b/packages/nextjs/src/config/webpack.ts index 68a73b91d818..3893aea9293f 100644 --- a/packages/nextjs/src/config/webpack.ts +++ b/packages/nextjs/src/config/webpack.ts @@ -78,10 +78,16 @@ export function constructWebpackConfigFunction( // TODO Handle possibility that user is using `SourceMapDevToolPlugin` (see // https://webpack.js.org/plugins/source-map-dev-tool-plugin/) - // Next doesn't let you change this is dev even if you want to - see + // Next doesn't let you change `devtool` in dev even if you want to, so don't bother trying - see // https://github.com/vercel/next.js/blob/master/errors/improper-devtool.md if (!buildContext.dev) { - newConfig.devtool = userNextConfig.sentry?.hideSourceMaps ? 'hidden-source-map' : 'source-map'; + // `hidden-source-map` produces the same sourcemaps as `source-map`, but doesn't include the `sourceMappingURL` + // comment at the bottom. For folks who aren't publicly hosting their sourcemaps, this is helpful because then + // the browser won't look for them and throw errors into the console when it can't find them. Because this is a + // front-end-only problem, and because `sentry-cli` handles sourcemaps more reliably with the comment than + // without, the option to use `hidden-source-map` only applies to the client-side build. + newConfig.devtool = + userNextConfig.sentry?.hideSourceMaps && !buildContext.isServer ? 'hidden-source-map' : 'source-map'; } newConfig.plugins = newConfig.plugins || []; diff --git a/packages/nextjs/test/config.test.ts b/packages/nextjs/test/config.test.ts index e5d0aa682f20..aee2bfddacfc 100644 --- a/packages/nextjs/test/config.test.ts +++ b/packages/nextjs/test/config.test.ts @@ -300,17 +300,24 @@ describe('webpack config', () => { expect(finalWebpackConfig).toEqual(expect.objectContaining(materializedUserWebpackConfig)); }); - it('allows for the use of `hidden-source-map` as `devtool` value', async () => { + it('allows for the use of `hidden-source-map` as `devtool` value for client-side builds', async () => { const userNextConfigHiddenSourceMaps = { ...userNextConfig, sentry: { ...userNextConfig.sentry } }; userNextConfigHiddenSourceMaps.sentry.hideSourceMaps = true; - const finalWebpackConfig = await materializeFinalWebpackConfig({ + const finalClientWebpackConfig = await materializeFinalWebpackConfig({ + userNextConfig: userNextConfigHiddenSourceMaps, + incomingWebpackConfig: clientWebpackConfig, + incomingWebpackBuildContext: clientBuildContext, + }); + + const finalServerWebpackConfig = await materializeFinalWebpackConfig({ userNextConfig: userNextConfigHiddenSourceMaps, incomingWebpackConfig: serverWebpackConfig, incomingWebpackBuildContext: serverBuildContext, }); - expect(finalWebpackConfig.devtool).toEqual('hidden-source-map'); + expect(finalClientWebpackConfig.devtool).toEqual('hidden-source-map'); + expect(finalServerWebpackConfig.devtool).toEqual('source-map'); }); describe('webpack `entry` property config', () => {