diff --git a/.npmrc b/.npmrc
new file mode 100644
index 0000000..9f89da2
--- /dev/null
+++ b/.npmrc
@@ -0,0 +1,3 @@
+shamefully-hoist=true
+public-hoist-pattern[]=*typeorm*
+public-hoist-pattern[]=*ts-node*
diff --git a/frontend/app/(dashboard)/transmittals/new/page.tsx b/frontend/app/(dashboard)/transmittals/new/page.tsx
index c80afff..e5ced26 100644
--- a/frontend/app/(dashboard)/transmittals/new/page.tsx
+++ b/frontend/app/(dashboard)/transmittals/new/page.tsx
@@ -5,6 +5,9 @@ import { ArrowLeft } from "lucide-react";
 import Link from "next/link";
 import { TransmittalForm } from "@/components/transmittal/transmittal-form";
 
+// Force dynamic rendering to prevent build-time prerendering issues
+export const dynamic = 'force-dynamic';
+
 export default function CreateTransmittalPage() {
   return (
     <section className="space-y-6 max-w-4xl">
diff --git a/frontend/next.config.mjs b/frontend/next.config.mjs
index e38e629..62d72b6 100644
--- a/frontend/next.config.mjs
+++ b/frontend/next.config.mjs
@@ -36,7 +36,13 @@ const nextConfig = {
   },
   */
 
-  // 5. Security Headers (แนะนำ)
+  // 5. Experimental: Handle client component static generation issues
+  experimental: {
+    // Disable static optimization for client components that cause build failures
+    missingSuspenseWithCSRBailout: false,
+  },
+
+  // 6. Security Headers (แนะนำ)
   async headers() {
     return [
       {