diff --git a/packages/next/client/components/layout-router.client.tsx b/packages/next/client/components/layout-router.client.tsx index a7bcf85f3357..fd3b8168ee23 100644 --- a/packages/next/client/components/layout-router.client.tsx +++ b/packages/next/client/components/layout-router.client.tsx @@ -235,7 +235,7 @@ export default function OuterLayoutRouter({ childProp: ChildProp loading: React.ReactNode | undefined }) { - const { childNodes, tree, url, stylesheets } = useContext(AppTreeContext) + const { childNodes, tree, url } = useContext(AppTreeContext) let childNodesForParallelRouter = childNodes.get(parallelRouterKey) if (!childNodesForParallelRouter) { @@ -256,11 +256,11 @@ export default function OuterLayoutRouter({ return ( <> - {stylesheets + {/* {stylesheets ? stylesheets.map((href) => ( )) - : null} + : null} */} {preservedSegments.map((preservedSegment) => { return ( diff --git a/packages/next/server/app-render.tsx b/packages/next/server/app-render.tsx index 95bfd1e10670..a27550af9f4f 100644 --- a/packages/next/server/app-render.tsx +++ b/packages/next/server/app-render.tsx @@ -946,6 +946,7 @@ export async function renderToHTML( dataStream: serverComponentsInlinedTransformStream?.readable, generateStaticHTML: generateStaticHTML || !hasConcurrentFeatures, flushEffectHandler, + initialStylesheets, }) } diff --git a/packages/next/server/node-web-streams-helper.ts b/packages/next/server/node-web-streams-helper.ts index 769df24adefd..2e4f8b19474c 100644 --- a/packages/next/server/node-web-streams-helper.ts +++ b/packages/next/server/node-web-streams-helper.ts @@ -136,25 +136,18 @@ export function createFlushEffectStream( }) } -export function createDevScriptTransformStream(): TransformStream< - Uint8Array, - Uint8Array -> { +export function createHeadInjectionTransformStream( + inject: string +): TransformStream { let injected = false - const foucTags = ` - ` return new TransformStream({ transform(chunk, controller) { const content = decodeText(chunk) let index if (!injected && (index = content.indexOf(' generateStaticHTML: boolean flushEffectHandler?: () => string + initialStylesheets?: string[] } ): Promise> { const closeTag = '' @@ -204,7 +199,18 @@ export async function continueFromInitialStream( suffixUnclosed != null ? createDeferredSuffixStream(suffixUnclosed) : null, dataStream ? createInlineDataStream(dataStream) : null, suffixUnclosed != null ? createSuffixStream(closeTag) : null, - dev ? createDevScriptTransformStream() : null, + createHeadInjectionTransformStream( + dev + ? ` + ` + : initialStylesheets + ? initialStylesheets + .map((href) => ``) + .join('') + : '' + ), ].filter(nonNullable) return transforms.reduce(