Sentry.io on Next.Js + Serverless: Module not found: Error: Can't resolve 'webpack'

Question

After adding Sentry.io with the automatic wizard (it added "@sentry/nextjs": "^6.11.0" in package.json), I can't build my Next.js project anymore.

> npm run build
(...)
Error: Command failed with exit code 1: node_modules/.bin/next build
warn  - No ESLint configuration detected. Run next lint to begin setup
Failed to compile.
ModuleNotFoundError: Module not found: Error: Can't resolve 'webpack' in '/builds/group/project/web/node_modules/@next/react-refresh-utils'
(...)
info  - Using webpack 5. Reason: Enabled by default https://nextjs.org/docs/messages/webpack5

I tried to npm install --save-dev webpack but I'm running in other errors like

./node_modules/fsevents/fsevents.node
Module parse failed: Unexpected character '�' (1:0)

How can I fix this?

[EDIT] I also use Serverless component @sls-next/serverless-component@3.2.0 to deploy on AWS. My next.config.js contains:

const moduleExports = { target: 'serverless' };

user_1488055 · Answer

Found. The problem was due to conflict with Serverless framework.

As described in https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/

I just added useServerlessTraceTarget: true to serverless.yml:

project:
  component: "@sls-next/serverless-component@3.2.0"
  inputs:
    useServerlessTraceTarget: true
    (...)

user_5934060 · Answer

Check the next.config.js file in the project root folder.

According to this guide, some changes are needed there, and maybe the wizard got it wrong: https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/

Post the file contents here for more help if needed.

Sentry.io on Next.Js + Serverless: Module not found: Error: Can't resolve 'webpack'

2 Answers