Skip to content

Next.js 13 with app router: "require function is used in a way in which dependencies cannot be statically extracted" #9120

@subvertallchris

Description

@subvertallchris

Is there an existing issue for this?

How do you use Sentry?

Sentry Saas (sentry.io)

Which SDK are you using?

@sentry/nextjs

SDK Version

7.71.0

Framework Version

Next.js 13.5.3-canary.3

Link to Sentry event

No response

SDK Setup

Sentry.init({
  dsn:  REDACTED,

  // Adjust this value in production, or use tracesSampler for greater control
  tracesSampleRate: 1,

  // Setting this option to true will print useful information to the console while you're setting up Sentry.
  debug: false,

  replaysOnErrorSampleRate: 1.0,

  // This sets the sample rate to be 10%. You may want this to be 100% while
  // in development and sample at a lower rate in production
  replaysSessionSampleRate: 0.1,

  // You can remove this option if you're not planning to use the Sentry Session Replay feature:
  integrations: [
    new Sentry.Replay({
      // Additional Replay configuration goes in here, for example:
      maskAllText: true,
      blockAllMedia: true,
    }),
  ],
});

Steps to Reproduce

  1. Add import * as Sentry from '@sentry/nextjs'; to a file
  2. Import this file from a client component

Expected Result

The code should be imported with no side-effects in the log.

Actual Result

With lib/reportError.ts defined as such:

import * as Sentry from '@sentry/nextjs';

export function reportError(e: Error, params?: object) {
  Sentry.captureException(e, params);
}

Importing it results in the following appearing every time in my dev console.

./node_modules/@sentry/nextjs/cjs/config/webpack.js
Critical dependency: require function is used in a way in which dependencies cannot be statically extracted

Import trace for requested module:
./node_modules/@sentry/nextjs/cjs/config/webpack.js
./node_modules/@sentry/nextjs/cjs/config/withSentryConfig.js
./node_modules/@sentry/nextjs/cjs/index.server.js
./lib/reportError.ts
./component/that/was/imported/First.tsx

Metadata

Metadata

Assignees

No one assigned

    Labels

    Package: nextjsIssues related to the Sentry Nextjs SDK
    No fields configured for issues without a type.

    Projects

    Status

    No status

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions