feat: Add sourcemap build arg for web dev deployments

.github/workflows/build-push.yml

@@ -75,7 +75,9 @@ jobs:
         with:
           context: "{{defaultContext}}:${{ matrix.context }}"
           platforms: ${{ matrix.platform }}
-          build-args: COMMIT_SHA=${{ fromJSON(steps.meta.outputs.json).labels['org.opencontainers.image.revision'] }}
+          build-args: |
+            COMMIT_SHA=${{ fromJSON(steps.meta.outputs.json).labels['org.opencontainers.image.revision'] }}
+            ENABLE_PROD_SOURCEMAP=${{ matrix.context == 'web' && github.ref_name == 'deploy/dev' }}
           labels: ${{ steps.meta.outputs.labels }}
           outputs: type=image,name=${{ env[matrix.image_name_env] }},push-by-digest=true,name-canonical=true,push=true
           cache-from: type=gha,scope=${{ matrix.service_name }}

web/Dockerfile

@@ -14,6 +14,8 @@ ENV PNPM_HOME="/pnpm"
 ENV PATH="$PNPM_HOME:$PATH"
 ARG NEXT_PUBLIC_BASE_PATH=""
 ENV NEXT_PUBLIC_BASE_PATH="$NEXT_PUBLIC_BASE_PATH"
+ARG ENABLE_PROD_SOURCEMAP="false"
+ENV ENABLE_PROD_SOURCEMAP="$ENABLE_PROD_SOURCEMAP"
 
 
 # install packages

web/next.config.ts

@@ -5,6 +5,7 @@ import createMDX from '@next/mdx'
 import { codeInspectorPlugin } from 'code-inspector-plugin'
 
 const isDev = process.env.NODE_ENV === 'development'
+const enableProdSourceMaps = process.env.ENABLE_PROD_SOURCEMAP === 'true'
 const withMDX = createMDX({
   extension: /\.mdx?$/,
   options: {
@@ -49,7 +50,7 @@ const nextConfig: NextConfig = {
 
     return config
   },
-  productionBrowserSourceMaps: false, // enable browser source map generation during the production build
+  productionBrowserSourceMaps: enableProdSourceMaps, // enable browser source map generation during the production build
   // Configure pageExtensions to include md and mdx
   pageExtensions: ['ts', 'tsx', 'js', 'jsx', 'md', 'mdx'],
   // https://nextjs.org/docs/messages/next-image-unconfigured-host