notes.dt.in.th

Next.js has a productionBrowserSourceMaps option which generates source maps for the client-side code. However, it does not generate source maps for the server-side code, which makes debugging server-side code in production difficult.

To generate source maps for the server-side code, directly modify Next.js’s webpack config:

// next.config.js
/** @type {import('next').NextConfig} */
const nextConfig = {
  // ...

  webpack: (config, { isServer }) => {
    if (isServer) {
      config.devtool = 'source-map'
    }
    return config
  },
}