fix: resolve dev server static asset warnings and 404 errors

- Remove unnecessary nonce warnings for static assets
- Update middleware to properly skip static file processing
- Fix unused variable error in catch block
- Eliminate console spam during development

lib/nonce-utils.ts

@@ -8,19 +8,12 @@ export async function getNonce(): Promise<string | undefined> {
     const headersList = await headers();
     const nonce = headersList.get("X-Nonce");
 
-    // Log for debugging hydration issues
+    // Don't warn about missing nonce as it's expected for static assets
-    if (!nonce && process.env.NODE_ENV === "development") {
+    // The middleware only adds nonce for non-static routes
-      console.warn(
-        "No nonce found in headers - this may cause hydration mismatches"
-      );
-    }
-
     return nonce || undefined;
-  } catch (error) {
+  } catch {
     // Headers not available (e.g., in client-side code)
-    if (process.env.NODE_ENV === "development") {
+    // This is expected and not an error
-      console.warn("Failed to get headers for nonce:", error);
-    }
     return undefined;
   }
 }

middleware.ts

@@ -2,21 +2,21 @@ import { type NextRequest, NextResponse } from "next/server";
 import { buildCSP, generateNonce } from "@/lib/csp-server";
 
 export function middleware(request: NextRequest) {
-  // Skip CSP for API routes (except CSP report endpoint)
+  const pathname = request.nextUrl.pathname;
+
+  // Skip middleware entirely for static assets and Next.js internals
   if (
-    request.nextUrl.pathname.startsWith("/api") &&
+    pathname.startsWith("/_next/") ||
-    !request.nextUrl.pathname.startsWith("/api/csp-report")
+    pathname.startsWith("/api/") ||
+    pathname.includes(".") ||
+    pathname.startsWith("/favicon")
   ) {
+    // Skip CSP for API routes except CSP report endpoint
+    if (pathname === "/api/csp-report") {
+      // Allow CSP report endpoint to proceed with CSP headers
+    } else {
       return NextResponse.next();
     }
-
-  // Skip CSP for static assets
-  if (
-    request.nextUrl.pathname.startsWith("/_next") ||
-    request.nextUrl.pathname.startsWith("/favicon") ||
-    request.nextUrl.pathname.includes(".")
-  ) {
-    return NextResponse.next();
   }
 
   const response = NextResponse.next();
@@ -104,13 +104,18 @@ export function middleware(request: NextRequest) {
 export const config = {
   matcher: [
     /*
-     * Match all request paths except for the ones starting with:
+     * Match all request paths except:
-     * - api (API routes, handled separately)
+     * - API routes (except /api/csp-report)
-     * - _next/static (static files)
+     * - Next.js internals (_next)
-     * - _next/image (image optimization files)
+     * - Static files (anything with a file extension)
-     * - favicon.ico (favicon file)
+     * - Favicon
-     * - public folder files
      */
-    "/((?!api|_next/static|_next/image|favicon.ico|.*\\..*|public).*)",
+    {
+      source: "/((?!_next|favicon.ico).*)",
+      missing: [
+        { type: "header", key: "next-router-prefetch" },
+        { type: "header", key: "purpose", value: "prefetch" },
+      ],
+    },
   ],
 };