search

getsentry / sentry-javascript

Official Sentry SDKs for JavaScript
https://sentry.io
MIT License
8.01k stars 1.58k forks source link

NextJS generateBuildId option not applied when Sentry is added to project #13971

Open rodolfoBee opened 1 month ago

rodolfoBee commented 1 month ago

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

8.33.0

Framework Version

Next.js: ^14.0.4

Link to Sentry event

No response

Reproduction Example/SDK Setup

Next.config.js example: 

/** @type {import('next').NextConfig} */
const nextConfig = {
  env,
  assetPrefix: isDev ? undefined : localEnv.PUBLIC_URL + baseUrl,
  generateBuildId: async () => {
     return process.env.CI_COMMIT_SHORT_SHA ?? null
  },
  crossOrigin: "anonymous",
  rewrites: async () => {
    return [
      // for k8s readiness probe
      {
      source: "/hello",
      destination: "/api/hello",
      },
      // for Prometheus Logging
      {
      source: "/metrics",
      destination: "/api/metrics",
      },
      {
      source: "/api/v1/:path*",
      destination: "http://...", // Masked for security reasons
      },
    ]
  },
  redirects: async () => {
  // for old browser fallback redirect
    return [
      {
      source: "/:path((?!old-browser-fallback.html).*)",
      permanent: false,
      has: [
      {
      type: "header",
      key: "User-Agent",
      value: "(.*Trident.*)",
      },
      ],
      destination: "/old-browser-fallback.html",
      },
    ]
  },
  output: "standalone",
  distDir: "build",
  i18n: {
  locales: ["default", "ko", "en", "ja", "jp"],
  defaultLocale: "default",
  localeDetection: false,
  },
  trailingSlash: true,
  compiler: {
     emotion: true,
  },
  images: {
    remotePatterns: [
      {
      protocol: "https",
      hostname: "...", // Masked for security reasons
      pathname: "/images/**",
      },
    ],
  },
 webpack: (config) => {
  const fileLoaderRule = config.module.rules.find((rule) => rule.test?.test?.(".svg"))

  config.module.rules.push(
  // Reapply the existing rule, but only for svg imports ending in ?url
  {
  ...fileLoaderRule,
  test: /\.svg$/i,
  resourceQuery: /url/, // *.svg?url
  },
  // Convert all other *.svg imports to React components
  {
  test: /\.svg$/i,
  issuer: fileLoaderRule.issuer,
  resourceQuery: { not: [...fileLoaderRule.resourceQuery.not, /url/] }, // exclude if *.svg?url
  use: ["@svgr/webpack"],
  }
  )

  // Modify the file loader rule to ignore *.svg, since we have it handled now.
  fileLoaderRule.exclude = /\.svg$/i

  return config
  },
}

module.exports = withSentryConfig(withBundleAnalyzer(nextConfig), {
  // For all available options, see:
  // https://github.com/getsentry/sentry-webpack-plugin#options

  org: process.env.NEXT_PUBLIC_SENTRY_ORG,
  project: process.env.NEXT_PUBLIC_SENTRY_PROJECT,

  // Only print logs for uploading source maps in CI
  silent: !process.env.CI,

  // For all available options, see:
  // https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/

  // Upload a larger set of source maps for prettier stack traces (increases build time)
  widenClientFileUpload: true,

  // Automatically annotate React components to show their full name in breadcrumbs and session replay
  reactComponentAnnotation: {
  enabled: true,
  },

  // Route browser requests to Sentry through a Next.js rewrite to circumvent ad-blockers.
  // This can increase your server load as well as your hosting bill.
  // Note: Check that the configured route will not match with your Next.js middleware, otherwise reporting of client-
  // side errors will fail.
  tunnelRoute: "/monitoring",

  // Hides source maps from generated client bundles
  hideSourceMaps: true,

  // Automatically tree-shake Sentry logger statements to reduce bundle size
  disableLogger: true,

  authToken: process.env.SENTRY_AUTH_TOKEN,
  release: {
    create: true,
    finalize: true,
    name: process.env.RELEASE_VERSION,
    setCommits: {
    ignoreMissing: true,
    auto: true,
  },
  },
})

Steps to Reproduce

When building the application for different platforms without the withSentryConfig, the resulting files' hash reflects the generateBuildID set in the next config options.

However, when adding Sentry and withSentryConfig, the hashes are no longer the same on different builds.

Expected Result

Different builds to have the same hash determined by the generateBuildID option:

- amd64 output logs
+ First Load JS shared by all 407 kB
├ chunks/framework-e7594c6edddb13df.js 45.2 kB
├ chunks/main-51034d304a9d5d27.js 43.7 kB
├ chunks/pages/_app-451abad8de42175b.js 315 kB
├ chunks/webpack-7bc12fe684855cd9.js 1.95 kB
└ css/232f3b92a2886585.css 1.49 kB
arm64 output logs
+ First Load JS shared by all 407 kB
├ chunks/framework-e7594c6edddb13df.js 45.2 kB
├ chunks/main-51034d304a9d5d27.js 43.7 kB
├ chunks/pages/_app-451abad8de42175b.js 315 kB
├ chunks/webpack-7bc12fe684855cd9.js 1.95 kB
└ css/232f3b92a2886585.css 1.49 kB

Actual Result

Different hashes:

amd64 output logs
+ First Load JS shared by all 484 kB
├ chunks/framework-22843801eeddc8d4.js 45.3 kB
├ chunks/main-2934badaedd887d6.js 43.8 kB
├ chunks/pages/_app-c2aabc539f7291b6.js 391 kB <--
├ chunks/webpack-dd7495768c40548a.js 2.08 kB <--
└ css/356b0903ab48b078.css 1.49 kB
arm64 output logs
+ First Load JS shared by all 484 kB
├ chunks/framework-22843801eeddc8d4.js 45.3 kB
├ chunks/main-2934badaedd887d6.js 43.8 kB
├ chunks/pages/_app-0b06c2663882bc14.js 391 kB <--
├ chunks/webpack-b77ae631eb868914.js 2.08 kB <--
└ css/356b0903ab48b078.css 1.49 kB
lforst commented 1 month ago

Thanks for reporting. It would be interesting to see in what way the files' contents are different. Generally, the hashes are content-addressable so there must be something different. We need to figure out what exactly is different so that we can make that part of the output deterministic.

kevva commented 1 day ago

I can also reproduce this. I'm seeing different _sentryDebugIds and _sentryDebugIdIdentifier. This could be related to why I'm seeing this issue. Not seeing this in all chunks like OP, but only in some.

Image