Sentry Nextjs causes dev server to recompile forever

@sentry/nextjs 6.14.0 causes the Next.js dev server to recompile infinitely. I'm on node 16.8 and nextjs 11.0.1.

Downgrading to @sentry/nextjs 6.13.3 fixes the infinite recompiling (without needing to downgrade other sentry packages).

Also experiencing the same recompile looping, nextjs@v11.1.2.
Downgrading to v6.13.3 also fixed for me.

Same here, nextjs@v12.0.2

tested on next@10.0.8
downgrading to v6.13.3 fixed the issue 👌🏻

Same here with nextjs@v10.2.0. Downgrading @sentry/nextjs to 6.13.3 fixes the problem

Same issue here.

Hey folks, thanks for writing in. Is it possible for anyone to provide a reproduction?

A copy of your next.config.js would be a big help as well.

Hey folks, thanks for writing in. Is it possible for anyone to provide a reproduction?

A copy of your next.config.js would be a big help as well.

// next.config.js
/* eslint-disable no-console */
const withPlugins = require('next-compose-plugins');
const withPWA = require('next-pwa');
const { withSentryConfig } = require('@sentry/nextjs');
// eslint-disable-next-line import/no-extraneous-dependencies
const webpack = require('webpack');
const { getBuildId } = require('./src/util/getBuildId');

const nextConfig = {
  // include git commit as buildId
  generateBuildId: async () => {
    const gitBuildId = await getBuildId();
    console.log(`>[BUILD ID]: ${gitBuildId}`);
    return gitBuildId;
  },
  env: {
    HASURA_URL: process.env.HASURA_URL,
    TIF_IMAGE_CDN: process.env.TIF_IMAGE_CDN,
    FRONTEND_WEB_URL: process.env.FRONTEND_WEB_URL,
    MAINTENANCE_MODE: process.env.MAINTENANCE_MODE,
    TIF_STUDIO_URL: process.env.TIF_STUDIO_URL,
    BUILD_ID: process.env.BUILD_ID,
    SENTRY_RELEASE: process.env.BUILD_ID,
    NEXT_PUBLIC_SENTRY_DSN: process.env.NEXT_PUBLIC_SENTRY_DSN
  },
  i18n: {
    locales: ['en'],
    defaultLocale: 'en'
  },
  images: {
    domains: ['cdn.thisisfashion.tv', 'thisisfashion.tv', 'localhost'],
    deviceSizes: [640, 750, 828, 1080, 1200, 1920, 2048, 3840],
    imageSizes: [16, 32, 48, 64, 96, 128, 256, 384]
  },
  module: {
    rules: [{ test: /\.tsx?$/, loader: 'awesome-typescript-loader' }], // other loader configuration goes in the array
    resolve: {
      extensions: ['.js', '.jsx', '.react.js', '.ts', '.tsx'],
      alias: {
        '@mui/styled-engine': '@mui/styled-engine-sc'
      }
    }
  }
};

const SentryWebpackPluginOptions = {
  // Additional config options for the Sentry Webpack plugin. Keep in mind that
  // the following options are set automatically, and overriding them is not
  // recommended:
  //   release, url, org, project, authToken, configFile, stripPrefix,
  //   urlPrefix, include, ignore
  silent: true // Suppresses all logs
  // For all available options, see:
  // https://github.com/getsentry/sentry-webpack-plugin#options.
};

// eslint-disable-next-line no-console
console.log(`>[NODE_ENV]: ${process.env.NODE_ENV}`);

const moduleExports = withPlugins(
  [
    [
      withPWA({
        pwa: {
          dest: 'public',
          disable: process.env.NODE_ENV === 'development',
          // maximumFileSizeToCacheInBytes: 5000000,
          // mode: 'development', // enable verbose loggin in prod
          buildExcludes: [
            /chunks\/images\/.*$/, // Don't precache files under .next/static/chunks/images this improves next-optimized-images behaviour
            /chunks\/pages\/api\/.*/ // Dont cache the API it needs fresh serverinfo
          ],
          exclude: [
            /\.map$/, // dont cache map files
            /^.*ts.*$/, // Dont let serviceworker touch the TS streams
            /-manifest.json$/ // exclude those pesky json files in _next root but still serve the ones we need from /_next/static
          ],
          skipWaiting: true, // installs new SW when available withou a promt, we only need to send a reload request to user.
          dynamicStartUrl: false, // recommend: set to false if your start url always returns same HTML document, then start url will be precached, this will help to speed up first load.
          reloadOnOnline: false, // Prevents reloads on offline/online switch
          sourcemap: false
        },
        webpack: (config, { buildId }) => {
          config.plugins.push(
            new webpack.DefinePlugin({
              'process.env': {
                BUILD_ID: JSON.stringify(buildId)
              }
            })
          );
          // eslint-disable-next-line no-param-reassign
          config.experiments = {
            layers: true,
            topLevelAwait: true
          };
          return config;
        }
      })
    ]
  ],
  process.env.MAINTENANCE_MODE === 'true'
    ? {
        async redirects() {
          return [
            {
              source: '/((?!maintenance).*)',
              destination: '/maintenance.html',
              permanent: false
            }
          ].filter(Boolean);
        }
      }
    : nextConfig
);

module.exports = withSentryConfig(moduleExports, SentryWebpackPluginOptions);

Another examples

const withPlugins = require("next-compose-plugins");
const { withSentryConfig } = require("@sentry/nextjs");
const withBundleAnalyzer = require("@next/bundle-analyzer")({
  enabled: process.env.ANALYZE === "true",
});

const isProd = process.env.NODE_ENV === "production";

const nextConfig = {
  images: {
    domains: [
      "***",
    ],
  },
  experimental: {
    esmExternals: false,
  },
  env: {
    SENDGRID_API_KEY: process.env.SENDGRID_API_KEY,
    NEXT_PUBLIC_STRIPE_KEY: process.env.NEXT_PUBLIC_STRIPE_KEY,
    STRIPE_SECRET_KEY: process.env.STRIPE_SECRET_KEY,
    APP_ENV: process.env.APP_ENV,
    NEXT_PUBLIC_CONTENTFUL_SPACE_ID:
      process.env.NEXT_PUBLIC_CONTENTFUL_SPACE_ID,
    NEXT_PUBLIC_CONTENTFUL_ACCESS_TOKEN:
      process.env.NEXT_PUBLIC_CONTENTFUL_ACCESS_TOKEN,
    NEXT_PUBLIC_CONTENTFUL_ENVIRONMENT:
      process.env.NEXT_PUBLIC_CONTENTFUL_ENVIRONMENT,
    NEXT_PUBLIC_DOMAIN: process.env.NEXT_PUBLIC_DOMAIN,
    NEXT_PUBLIC_HEAP_ID: process.env.NEXT_PUBLIC_HEAP_ID,
  },
  assetPrefix: isProd ? process.env.NEXT_PUBLIC_DOMAIN : "",
  async redirects() {
    return [
      {
        source: "/dashboard",
        destination: "/",
        permanent: true,
      },
      {
        source: "/login",
        destination: "/signin",
        permanent: true,
      },
      {
        source: "/auth/academic-sign-up",
        destination: "/academic-signup",
        permanent: true,
      },
      {
        source: "/auth/login",
        destination: "/signin",
        permanent: true,
      },
      {
        source: "/academic",
        destination: "/signin",
        permanent: true,
      },
      {
        source: "/academic-access",
        destination: "/signin",
        permanent: true,
      },
      {
        source: "/academic-access-login",
        destination: "/signin",
        permanent: true,
      },
      {
        source: "/academic-register",
        destination: "/signin",
        permanent: true,
      },
      {
        source: "/academic-access-login",
        destination: "/signin",
        permanent: true,
      },
      {
        source: "/auth/verify-academic-sign-up",
        destination: "/verify-academic-sign-up",
        permanent: true,
      },
      { source: "/auth/:path*", destination: "/:path*", permanent: true },
    ];
  },
};

const SentryWebpackPluginOptions = {
  // Additional config options for the Sentry Webpack plugin. Keep in mind that
  // the following options are set automatically, and overriding them is not
  // recommended:
  //   release, url, org, project, authToken, configFile, stripPrefix,
  //   urlPrefix, include, ignore
  // For all available options, see:
  // https://github.com/getsentry/sentry-webpack-plugin#options.
};

// Make sure adding Sentry options is the last code to run before exporting, to
// ensure that your source maps include changes from all other Webpack plugins

module.exports = withPlugins(
  [[withBundleAnalyzer], [withSentryConfig, SentryWebpackPluginOptions]],
  nextConfig
);

Same issue here:

const { withSentryConfig } = require('@sentry/nextjs')
const withImages = require('next-images')
const { i18n } = require('./next-i18next.config')
const { BGD_ENV } = process.env

const basePath = '/checkout'

const SentryWebpackPluginOptions = {
  // Additional config options for the Sentry Webpack plugin. Keep in mind that
  // the following options are set automatically, and overriding them is not
  // recommended:
  // urlPrefix: `~${basePath}/_next`,
  //   release, url, org, project, authToken, configFile, stripPrefix,
  //   urlPrefix, include, ignore
  // For all available options, see:
  // https://github.com/getsentry/sentry-webpack-plugin#options.
}

const moduleExports = withImages({
  i18n,
  experimental: { esmExternals: true },
  crossOrigin: 'anonymous',
  images: {
    disableStaticImages: true,
    domains: ['citygross.se']
  },
  env: {
    BGD_ENV
  },
  basePath

  // Make sure adding Sentry options is the last code to run before exporting, to
  // ensure that your source maps include changes from all other Webpack plugins
})

module.exports = withSentryConfig(moduleExports, SentryWebpackPluginOptions)

Upgrading to latest sentry caused it for me too. Downgrading fixes it.

Sorry, everyone! Should be fixed in #4123.

Fix released as part of https://www.npmjs.com/package/@sentry/nextjs/v/6.14.1, please let us know if there are any other problems!

It works thanks :)

facing the same on "@sentry/nextjs": "6.14.0" trying to resolve the issue from yesterday but no luck, upgrading to 6.14.1 resolved the issue. ❤

@lobsterkatie

Great fix! Was also suffering from the very same problem in our Next.js project for long, only to find the root cause here (missing dev)!

#4123 should be referenced by anyone who is also doing webpack isServer check within their next.config.js.

Kudos to @lobsterkatie 👍 !

Navigation Menu

Repository navigation

Sentry Nextjs causes dev server to recompile forever #4115

Metadata

Assignees

Labels

Projects

Milestone

Relationships

Development

Sentry Nextjs causes dev server to recompile forever #4115

Description

Activity

svict4 commented on Nov 4, 2021

gish commented on Nov 4, 2021

mhase commented on Nov 4, 2021

willianrod commented on Nov 4, 2021

sanderkooger commented on Nov 4, 2021

AbhiPrasad commented on Nov 4, 2021

sanderkooger commented on Nov 4, 2021

jonahallibone commented on Nov 4, 2021

Joelgullander commented on Nov 4, 2021

adikari commented on Nov 5, 2021

lobsterkatie commented on Nov 5, 2021

AbhiPrasad commented on Nov 5, 2021

ulysset commented on Nov 5, 2021

MAfzalKhan1997 commented on Nov 9, 2021

jonioni commented on Jan 12, 2022

Metadata

Metadata

Assignees

Labels

Projects

Milestone

Relationships

Development

Issue actions