e2a4fc68b7
Root cause analysis: - Next.js 16 Server/Client Component boundary issue - Webpack module chunking fails with named exports from Client Components - Error: "Cannot read properties of undefined (reading 'call')" Solution: - Created release-sidebar-wrapper.tsx to isolate import boundary - Server Component (layout.tsx) now imports via wrapper - Wrapper uses default export, which webpack handles better Technical details: - Server Component -> direct import -> Client Component = module undefined - Wrapper component breaks the problematic import chain - Default exports handle webpack chunking more reliably than named exports Documentation: - Added comprehensive troubleshooting guide - Documents 4 solution approaches - Lists best practices to prevent future occurrences - Identifies other potential problem areas in codebase Files changed: - app/(marketing)/releases/layout.tsx (import via wrapper) - app/(marketing)/releases/components/release-sidebar-wrapper.tsx (new) - docs/troubleshooting/webpack-module-resolution-error.md (new) Related: This is a known Next.js 15-16 issue with Server/Client boundaries
21 lines
511 B
TypeScript
21 lines
511 B
TypeScript
/**
|
|
* Release Sidebar Wrapper
|
|
*
|
|
* Simple wrapper to avoid webpack module resolution issues
|
|
*/
|
|
|
|
import { ReleaseSidebar } from './release-sidebar'
|
|
import type { ReleaseNote, GroupMetadata, CategoryMetadata } from '@/lib/mdx/releases'
|
|
|
|
interface ReleaseSidebarWrapperProps {
|
|
releases: ReleaseNote[]
|
|
metadata: {
|
|
groups: GroupMetadata[]
|
|
categories: CategoryMetadata[]
|
|
}
|
|
}
|
|
|
|
export default function ReleaseSidebarWrapper(props: ReleaseSidebarWrapperProps) {
|
|
return <ReleaseSidebar {...props} />
|
|
}
|