🔧 Improve sourcemaps config

next.config.js

@@ -50,22 +50,16 @@ const nextConfig = {
       config.devtool = 'source-map'
     }
 
-    // if (process.env.SENTRY_AUTH_TOKEN) {
-    //   config.plugins.push(
-    //     sentryWebpackPlugin({
-    //       authToken: process.env.SENTRY_AUTH_TOKEN_SOURCEMAPS,
-    //       org: 'betagouv',
-    //       project: 'nosgestesclimat-nextjs',
-    //     })
-    //   )
-    // }
-
     // We do not want to split the chunks too much
     config.optimization.splitChunks.minSize = 300000
 
     return config
   },
   productionBrowserSourceMaps: true,
+  sentry: {
+    hideSourceMaps: false, // Ensure source maps are not hidden
+  },
+  outputFileTracing: true,
   experimental: {
     outputFileTracingExcludes: {
       '*': ['.next/cache/webpack', '.git/**/*', 'cypress/**/*'],
@@ -85,40 +79,45 @@ const nextConfig = {
   },
 }
 
-const sentryConfig = [
-  {
-    // For all available options, see:
-    // https://github.com/getsentry/sentry-webpack-plugin#options
-
-    // Suppresses source map uploading logs during build
-    silent: true,
-    org: 'incubateur-ademe',
-    project: 'nosgestesclimat-nextjs',
-    url: 'https://sentry.incubateur.net/',
-    authToken: process.env.SENTRY_AUTH_TOKEN,
-  },
-  {
-    // For all available options, see:
-    // https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/
+/** @type {import('@sentry/nextjs').SentryBuildOptions} */
+const sentryConfig = {
+  // For all available options, see:
+  // https://github.com/getsentry/sentry-webpack-plugin#options
+
+  org: 'incubateur-ademe',
+  project: 'nosgestesclimat-nextjs',
+  sentryUrl: 'https://sentry.incubateur.net',
 
-    // Upload a larger set of source maps for prettier stack traces (increases build time)
-    widenClientFileUpload: false,
+  // Only print logs for uploading source maps in CI
+  silent: false,
+  debug: true,
 
-    // Transpiles SDK to be compatible with IE11 (increases bundle size)
-    transpileClientSDK: false,
+  authToken: process.env.SENTRY_AUTH_TOKEN,
 
-    // Routes browser requests to Sentry through a Next.js rewrite to circumvent ad-blockers (increases server load)
-    tunnelRoute: '/monitoring',
+  // For all available options, see:
+  // https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/
 
-    // Hides source maps from generated client bundles
-    hideSourceMaps: false,
+  // Upload a larger set of source maps for prettier stack traces (increases build time)
+  widenClientFileUpload: true,
 
-    // Automatically tree-shake Sentry logger statements to reduce bundle size
-    disableLogger: true,
+  sourcemaps: {
+    deleteSourcemapsAfterUpload: true,
   },
-]
+
+  // Uncomment to 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,
+}
 
 module.exports =
   process.env.NODE_ENV !== 'development'
-    ? withSentryConfig(withMDX(nextConfig), ...sentryConfig)
+    ? withSentryConfig(withMDX(nextConfig), sentryConfig)
     : nextConfig

package.json

@@ -44,8 +44,8 @@
     "@next/mdx": "^14.2.7",
     "@publicodes/react-ui": "^1.3.3",
     "@publicodes/tools": "^1.2.0",
-    "@sentry/nextjs": "^8",
-    "@sentry/react": "^8.10.0",
+    "@sentry/nextjs": "^8.51.0",
+    "@sentry/react": "^8.51.0",
     "@socialgouv/react-departements": "^3.0.0",
     "@swc/core": "^1.7.12",
     "@swc/jest": "^0.2.36",
@@ -102,7 +102,8 @@
     "@babel/runtime": "^7.23.1",
     "@faker-js/faker": "^8.4.1",
     "@incubateur-ademe/nosgestesclimat-scripts": "^0.6.0",
-    "@sentry/webpack-plugin": "^2.22.4",
+    "@sentry/utils": "^8.51.0",
+    "@sentry/webpack-plugin": "^3.1.0",
     "@simonsmith/cypress-image-snapshot": "^9.0.1",
     "@types/mdx": "^2.0.10",
     "@types/mocha": "^10.0.6",

sentry.client.config.ts

@@ -7,13 +7,11 @@ import * as Sentry from '@sentry/nextjs'
 Sentry.init({
   dsn: 'https://[email protected]/118',
 
-  enableTracing: true,
+  // Define how likely traces are sampled. Adjust this value in production, or use tracesSampler for greater control.
+  tracesSampleRate: process.env.NODE_ENV === 'production' ? 0.1 : 1,
 
-  // Only for previews including preprod
-  debug: process.env.NODE_ENV !== 'production',
-
-  sampleRate: process.env.NODE_ENV === 'production' ? 0.1 : 1,
-
-  // Disable sentry for development based on local data
   enabled: process.env.NODE_ENV !== 'development',
+
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
 })

sentry.edge.config.ts

@@ -8,13 +8,9 @@ import * as Sentry from '@sentry/nextjs'
 Sentry.init({
   dsn: 'https://[email protected]/118',
 
-  enableTracing: true,
-
-  // Only for previews including preprod
-  debug: process.env.NODE_ENV !== 'production',
-
-  sampleRate: process.env.NODE_ENV === 'production' ? 0.1 : 1,
-
-  // Disable sentry for development based on local data
+  // Define how likely traces are sampled. Adjust this value in production, or use tracesSampler for greater control.
+  tracesSampleRate: process.env.NODE_ENV === 'production' ? 0.1 : 1,
   enabled: process.env.NODE_ENV !== 'development',
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
 })

sentry.server.config.ts

@@ -7,15 +7,9 @@ import * as Sentry from '@sentry/nextjs'
 Sentry.init({
   dsn: 'https://[email protected]/118',
 
-  // Enable tracing for more detailed performance monitoring
-  enableTracing: true,
-
-  // Only for previews including preprod
-  debug: process.env.NODE_ENV !== 'production',
-
-  // In production keep a 10% sample rate to avoid high costs
-  sampleRate: process.env.NODE_ENV === 'production' ? 0.1 : 1,
-
-  // Enable Sentry in all environments for debugging
+  // Define how likely traces are sampled. Adjust this value in production, or use tracesSampler for greater control.
+  tracesSampleRate: process.env.NODE_ENV === 'production' ? 0.1 : 1,
   enabled: process.env.NODE_ENV !== 'development',
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
 })

src/instrumentation.ts

@@ -1,3 +1,5 @@
+import * as Sentry from '@sentry/nextjs'
+
 export async function register() {
   if (process.env.NEXT_RUNTIME === 'nodejs') {
     await import('../sentry.server.config')
@@ -7,3 +9,5 @@ export async function register() {
     await import('../sentry.edge.config')
   }
 }
+
+export const onRequestError = Sentry.captureRequestError