From 434412afe7fb069ccd4765db2b02e68782aacad9 Mon Sep 17 00:00:00 2001 From: Luca Forstner Date: Fri, 5 Apr 2024 08:18:43 +0000 Subject: [PATCH 1/3] feat(nextjs): Prepare Next.js usage for using `@vercel/otel` --- packages/nextjs/package.json | 18 ++++++++++++--- packages/nextjs/src/config/webpack.ts | 32 +++++++++++++-------------- packages/nextjs/src/index.client.ts | 6 ----- packages/nextjs/src/index.server.ts | 8 ------- 4 files changed, 31 insertions(+), 33 deletions(-) diff --git a/packages/nextjs/package.json b/packages/nextjs/package.json index 1dbb1509b55c..63e55e176f03 100644 --- a/packages/nextjs/package.json +++ b/packages/nextjs/package.json @@ -11,16 +11,28 @@ }, "main": "build/cjs/index.server.js", "module": "build/esm/index.server.js", - "browser": "build/esm/index.client.js", "types": "build/types/index.types.d.ts", "exports": { "./package.json": "./package.json", ".": { + "edge": { + "default": "./build/esm/edge/index.js" + }, + "edge-light": { + "default": "./build/esm/edge/index.js" + }, + "worker": { + "default": "./build/esm/edge/index.js" + }, + "workerd": { + "default": "./build/esm/edge/index.js" + }, "browser": { "import": "./build/esm/index.client.js", "require": "./build/cjs/index.client.js" }, "node": "./build/cjs/index.server.js", + "import": "./build/esm/index.server.js", "types": "./build/types/index.types.d.ts" }, "./register": { @@ -28,11 +40,11 @@ "default": "./build/register.mjs" } }, -"./hook": { + "./hook": { "import": { "default": "./build/hook.mjs" } -} + } }, "typesVersions": { "<4.9": { diff --git a/packages/nextjs/src/config/webpack.ts b/packages/nextjs/src/config/webpack.ts index 824f291a5504..ca4b6fd04699 100644 --- a/packages/nextjs/src/config/webpack.ts +++ b/packages/nextjs/src/config/webpack.ts @@ -24,11 +24,11 @@ import type { } from './types'; import { getWebpackPluginOptions } from './webpackPluginOptions'; -const RUNTIME_TO_SDK_ENTRYPOINT_MAP = { - client: './client', - server: './server', - edge: './edge', -} as const; +// const RUNTIME_TO_SDK_ENTRYPOINT_MAP = { +// client: './client', +// server: './server', +// edge: './edge', +// } as const; // Next.js runs webpack 3 times, once for the client, the server, and for edge. Because we don't want to print certain // warnings 3 times, we keep track of them here. @@ -79,17 +79,17 @@ export function constructWebpackConfigFunction( // Add a loader which will inject code that sets global values addValueInjectionLoader(newConfig, userNextConfig, userSentryOptions, buildContext); - newConfig.module.rules.push({ - test: /node_modules[/\\]@sentry[/\\]nextjs/, - use: [ - { - loader: path.resolve(__dirname, 'loaders', 'sdkMultiplexerLoader.js'), - options: { - importTarget: RUNTIME_TO_SDK_ENTRYPOINT_MAP[runtime], - }, - }, - ], - }); + // newConfig.module.rules.push({ + // test: /node_modules[/\\]@sentry[/\\]nextjs/, + // use: [ + // { + // loader: path.resolve(__dirname, 'loaders', 'sdkMultiplexerLoader.js'), + // options: { + // importTarget: RUNTIME_TO_SDK_ENTRYPOINT_MAP[runtime], + // }, + // }, + // ], + // }); let pagesDirPath: string | undefined; const maybePagesDirPath = path.join(projectDir, 'pages'); diff --git a/packages/nextjs/src/index.client.ts b/packages/nextjs/src/index.client.ts index c7ae01e45598..4836c98e819b 100644 --- a/packages/nextjs/src/index.client.ts +++ b/packages/nextjs/src/index.client.ts @@ -2,9 +2,3 @@ export * from './client'; // This file is the main entrypoint for non-Next.js build pipelines that use // the package.json's "browser" field or the Edge runtime (Edge API routes and middleware) - -/** - * This const serves no purpose besides being an identifier for this file that the SDK multiplexer loader can use to - * determine that this is in fact a file that wants to be multiplexed. - */ -export const _SENTRY_SDK_MULTIPLEXER = true; diff --git a/packages/nextjs/src/index.server.ts b/packages/nextjs/src/index.server.ts index 4a9536d25ae1..133b6ecf1da0 100644 --- a/packages/nextjs/src/index.server.ts +++ b/packages/nextjs/src/index.server.ts @@ -1,10 +1,2 @@ export * from './config'; export * from './server'; - -// This file is the main entrypoint on the server and/or when the package is `require`d - -/** - * This const serves no purpose besides being an identifier for this file that the SDK multiplexer loader can use to - * determine that this is in fact a file that wants to be multiplexed. - */ -export const _SENTRY_SDK_MULTIPLEXER = true; From bfaa4c9d4b42f0898dbc760cdf3e94dac30c0cfd Mon Sep 17 00:00:00 2001 From: Luca Forstner Date: Fri, 5 Apr 2024 08:27:53 +0000 Subject: [PATCH 2/3] rm 4 good --- packages/nextjs/src/config/loaders/index.ts | 1 - .../config/loaders/sdkMultiplexerLoader.ts | 24 ------------------- packages/nextjs/src/config/webpack.ts | 18 -------------- 3 files changed, 43 deletions(-) delete mode 100644 packages/nextjs/src/config/loaders/sdkMultiplexerLoader.ts diff --git a/packages/nextjs/src/config/loaders/index.ts b/packages/nextjs/src/config/loaders/index.ts index 27620e004f39..322567c1495b 100644 --- a/packages/nextjs/src/config/loaders/index.ts +++ b/packages/nextjs/src/config/loaders/index.ts @@ -1,4 +1,3 @@ export { default as valueInjectionLoader } from './valueInjectionLoader'; export { default as prefixLoader } from './prefixLoader'; export { default as wrappingLoader } from './wrappingLoader'; -export { default as sdkMultiplexerLoader } from './sdkMultiplexerLoader'; diff --git a/packages/nextjs/src/config/loaders/sdkMultiplexerLoader.ts b/packages/nextjs/src/config/loaders/sdkMultiplexerLoader.ts deleted file mode 100644 index 9373b9d0ced3..000000000000 --- a/packages/nextjs/src/config/loaders/sdkMultiplexerLoader.ts +++ /dev/null @@ -1,24 +0,0 @@ -import type { LoaderThis } from './types'; - -type LoaderOptions = { - importTarget: string; -}; - -/** - * This loader allows us to multiplex SDKs depending on what is passed to the `importTarget` loader option. - * If this loader encounters a file that contains the string "__SENTRY_SDK_MULTIPLEXER__" it will replace it's entire - * content with an "export all"-statement that points to `importTarget`. - * - * In our case we use this to multiplex different SDKs depending on whether we're bundling browser code, server code, - * or edge-runtime code. - */ -export default function sdkMultiplexerLoader(this: LoaderThis, userCode: string): string { - if (!userCode.includes('_SENTRY_SDK_MULTIPLEXER')) { - return userCode; - } - - // We know one or the other will be defined, depending on the version of webpack being used - const { importTarget } = 'getOptions' in this ? this.getOptions() : this.query; - - return `export * from "${importTarget}";`; -} diff --git a/packages/nextjs/src/config/webpack.ts b/packages/nextjs/src/config/webpack.ts index ca4b6fd04699..066d26c6d64c 100644 --- a/packages/nextjs/src/config/webpack.ts +++ b/packages/nextjs/src/config/webpack.ts @@ -24,12 +24,6 @@ import type { } from './types'; import { getWebpackPluginOptions } from './webpackPluginOptions'; -// const RUNTIME_TO_SDK_ENTRYPOINT_MAP = { -// client: './client', -// server: './server', -// edge: './edge', -// } as const; - // Next.js runs webpack 3 times, once for the client, the server, and for edge. Because we don't want to print certain // warnings 3 times, we keep track of them here. let showedMissingGlobalErrorWarningMsg = false; @@ -79,18 +73,6 @@ export function constructWebpackConfigFunction( // Add a loader which will inject code that sets global values addValueInjectionLoader(newConfig, userNextConfig, userSentryOptions, buildContext); - // newConfig.module.rules.push({ - // test: /node_modules[/\\]@sentry[/\\]nextjs/, - // use: [ - // { - // loader: path.resolve(__dirname, 'loaders', 'sdkMultiplexerLoader.js'), - // options: { - // importTarget: RUNTIME_TO_SDK_ENTRYPOINT_MAP[runtime], - // }, - // }, - // ], - // }); - let pagesDirPath: string | undefined; const maybePagesDirPath = path.join(projectDir, 'pages'); const maybeSrcPagesDirPath = path.join(projectDir, 'src', 'pages'); From 6e3c7e7a1375f6d20fa6da220ebee3f2d4f90a82 Mon Sep 17 00:00:00 2001 From: Luca Forstner Date: Mon, 8 Apr 2024 08:23:17 +0000 Subject: [PATCH 3/3] Also export CJS versions --- packages/nextjs/package.json | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/packages/nextjs/package.json b/packages/nextjs/package.json index 63e55e176f03..162d45e2cda2 100644 --- a/packages/nextjs/package.json +++ b/packages/nextjs/package.json @@ -16,15 +16,23 @@ "./package.json": "./package.json", ".": { "edge": { + "import": "./build/esm/edge/index.js", + "require": "./build/cjs/edge/index.js", "default": "./build/esm/edge/index.js" }, "edge-light": { + "import": "./build/esm/edge/index.js", + "require": "./build/cjs/edge/index.js", "default": "./build/esm/edge/index.js" }, "worker": { + "import": "./build/esm/edge/index.js", + "require": "./build/cjs/edge/index.js", "default": "./build/esm/edge/index.js" }, "workerd": { + "import": "./build/esm/edge/index.js", + "require": "./build/cjs/edge/index.js", "default": "./build/esm/edge/index.js" }, "browser": {