[Windows] `TypeError` when running Next.js app with middleware and latest @sentry/nextjs package

[josh-]

Is there an existing issue for this?

• I have checked for existing issues https://github.com/getsentry/sentry-javascript/issues
• I have reviewed the documentation https://docs.sentry.io/
• I am using the latest SDK release https://github.com/getsentry/sentry-javascript/releases

How do you use Sentry?

Sentry Saas (sentry.io)

Which package are you using?

@sentry/angular

SDK Version

7.31.1

Framework Version

@sentry/nextjs 7.31.1

Link to Sentry event

https://sentry.io/organizations/triton-digital-canada-inc/issues/3883394829/

SDK Setup

The sample repro repository uses the following values, where the error still occurs.

sentry.client.config.js:

Sentry.init({
 dsn: null,
 // Adjust this value in production, or use tracesSampler for greater control
 tracesSampleRate: 1.0,
 // ...
 // Note: if you want to override the automatic release value, do not set a
 // `release` value here - use the environment variable `SENTRY_RELEASE`, so
 // that it will also get attached to your source maps
});

sentry.client.edge.js:

Sentry.init({
 dsn: null,
 // Adjust this value in production, or use tracesSampler for greater control
 tracesSampleRate: 1.0,
 // ...
 // Note: if you want to override the automatic release value, do not set a
 // `release` value here - use the environment variable `SENTRY_RELEASE`, so
 // that it will also get attached to your source maps
});

sentry.client.server.js:

Sentry.init({
 dsn: null,
 // Adjust this value in production, or use tracesSampler for greater control
 tracesSampleRate: 1.0,
 // ...
 // Note: if you want to override the automatic release value, do not set a
 // `release` value here - use the environment variable `SENTRY_RELEASE`, so
 // that it will also get attached to your source maps
});

Steps to Reproduce

1. Running on Windows, clone this repository which is a reproduction of the issue
2. Run yarn install
3. Run yarn dev
4. Browse to http://localhost:3000
5. Observe an error on-screen and in your terminal

Expected Result

Page is rendered successfully.

Actual Result

This could be related to #6771? (cc @lforst)

Confirmed that it works as expected with v7.29.0

[josh-]

Have confirmed that this issue is still present when the middleware.ts and pages directory is in the root folder too (as opposed to the src directory in the reproduction sample app)

[lforst]

@josh- That looks super fishy. Can you try deleting your .next folder and rebuilding the project or running dev mode agin? Thanks!

[lforst]

Also just want to make sure you called your config files the following:

• sentry.client.config.js
• sentry.edge.config.js
• sentry.server.config.js

and not

• sentry.client.config.js
• sentry.client.edge.js
• sentry.client.server.js

[josh-]

@josh- That looks super fishy. Can you try deleting your .next folder and rebuilding the project or running dev mode agin? Thanks!

Yep, same result:

PS C:\Users\Josh\Desktop\windows-next-sentry-middleware-repro> Remove-Item -Path .\.next\ -Recurse
PS C:\Users\Josh\Desktop\windows-next-sentry-middleware-repro> yarn dev
yarn run v1.22.19
$ next dev
ready - started server on 0.0.0.0:3000, url: http://localhost:3000
event - compiled client and server successfully in 2.7s (383 modules)
wait - compiling /middleware (client and server)...
event - compiled successfully in 1200 ms (344 modules)
wait - compiling /_error (client and server)...
error - sentry-wrapper-module (31:0) @ <unknown>
error - _sentry_nextjs__WEBPACK_IMPORTED_MODULE_1__.wrapMiddlewareWithSentry is not a function
 29 | 
 30 | const middleware = userProvidedNamedHandler
> 31 | ? Sentry.wrapMiddlewareWithSentry(userProvidedNamedHandler)
 32 | : undefined;
 33 | const middlewareWrapperTemplate = userProvidedDefaultHandler ? Sentry.wrapMiddlewareWithSentry(userProvidedDefaultHandler) : undefined;
 34 | 
error - sentry-wrapper-module (31:0) @ <unknown>
error - _sentry_nextjs__WEBPACK_IMPORTED_MODULE_1__.wrapMiddlewareWithSentry is not a function
 29 | 
 30 | const middleware = userProvidedNamedHandler
> 31 | ? Sentry.wrapMiddlewareWithSentry(userProvidedNamedHandler)
 32 | : undefined;
 33 | const middlewareWrapperTemplate = userProvidedDefaultHandler ? Sentry.wrapMiddlewareWithSentry(userProvidedDefaultHandler) : undefined;
 34 | 
error - sentry-wrapper-module (31:0) @ <unknown>

We've also been able to reproduce this on several different windows machines who are cloning the issue reproduction repository fresh (and in our internal app where we initially ran into this)

[josh-]

Also just want to make sure you called your config files the following:

• sentry.client.config.js
• sentry.edge.config.js
• sentry.server.config.js

and not

• sentry.client.config.js
• sentry.client.edge.js
• sentry.client.server.js

Can confirm they are named correctly in the issue reproduction repository (and also our internal app):

PS C:\Users\Josh\Desktop\windows-next-sentry-middleware-repro> Get-ChildItem -Path $path -Filter "*sentry*"


 Directory: C:\Users\Josh\Desktop\windows-next-sentry-middleware-repro


Mode LastWriteTime Length Name
---- ------------- ------ ----
-a---- 19/01/2023 2:14 PM 613 sentry.client.config.js
-a---- 19/01/2023 2:14 PM 640 sentry.edge.config.js
-a---- 19/01/2023 2:14 PM 621 sentry.server.config.js

[lforst]

Ah sorry took me way longer to understand this issue happens on windows than it should have 😬 We'll look into it!

[lforst]

@josh- Weird ask but can you try replacing line 71 in node_modules/@sentry/nextjs/cjs/config/webpack.js like the following:

- test: /node_modules\/@sentry\/nextjs/,
+ test: /node_modules[\/\\]@sentry[\/\\]nextjs/,

and try building your project again? Thank you!