From 90a361875a326093d85692f8a8541d35c3d58f2f Mon Sep 17 00:00:00 2001 From: Shu Ding Date: Mon, 12 Sep 2022 16:55:28 +0200 Subject: [PATCH] rename entry directive --- .../loaders/next-flight-loader/index.ts | 18 ++++++------------ .../webpack/plugins/flight-manifest-plugin.ts | 7 +++++-- .../client/components/app-router.client.tsx | 2 +- .../client/components/hot-reloader.client.tsx | 2 +- .../client/components/layout-router.client.tsx | 2 +- packages/next/shared/lib/constants.ts | 2 ++ packages/next/taskfile-swc.js | 5 ++--- test/e2e/app-dir/convention/app/client/page.js | 2 +- 8 files changed, 19 insertions(+), 21 deletions(-) diff --git a/packages/next/build/webpack/loaders/next-flight-loader/index.ts b/packages/next/build/webpack/loaders/next-flight-loader/index.ts index 78be82af191a1..3fee533cccc7a 100644 --- a/packages/next/build/webpack/loaders/next-flight-loader/index.ts +++ b/packages/next/build/webpack/loaders/next-flight-loader/index.ts @@ -1,4 +1,5 @@ import path from 'path' +import { RSC_CLIENT_ENTRY } from '../../../../shared/lib/constants' import { checkExports } from '../../../analysis/get-page-static-info' import { parse } from '../../../swc' @@ -18,11 +19,6 @@ function transformServer(source: string, isESModule: boolean) { ) } -const FLIGHT_TYPE = { - server: 'server-entry', - client: 'client-entry', -} as const - function containsPath(parent: string, child: string) { const relation = path.relative(parent, child) return !!relation && !relation.startsWith('..') && !path.isAbsolute(relation) @@ -64,18 +60,16 @@ export default async function transformSource( const isResourcePageOrLayoutFile = isPageOrLayoutFile(this.resourcePath) - // Assign the rsc module type to buildInfo, by default is server-entry - buildInfo.rsc = { - type: FLIGHT_TYPE.server, - } + // Assign the RSC meta information to buildInfo. + buildInfo.rsc = {} for (const node of firstTwoNodes) { if ( node.type === 'ExpressionStatement' && node.expression.type === 'StringLiteral' ) { - if (node.expression.value === FLIGHT_TYPE.client) { + if (node.expression.value === RSC_CLIENT_ENTRY) { // Detect client entry - buildInfo.rsc.type = FLIGHT_TYPE.client + buildInfo.rsc.type = RSC_CLIENT_ENTRY break } } @@ -94,7 +88,7 @@ export default async function transformSource( } } - if (buildInfo.rsc.type === FLIGHT_TYPE.client) { + if (buildInfo.rsc.type === RSC_CLIENT_ENTRY) { errorForInvalidDataFetching(this.emitError) const code = transformClient(this.resourcePath) return code diff --git a/packages/next/build/webpack/plugins/flight-manifest-plugin.ts b/packages/next/build/webpack/plugins/flight-manifest-plugin.ts index 31767cbd0b36c..9f49a7977588c 100644 --- a/packages/next/build/webpack/plugins/flight-manifest-plugin.ts +++ b/packages/next/build/webpack/plugins/flight-manifest-plugin.ts @@ -6,7 +6,10 @@ */ import { webpack, sources } from 'next/dist/compiled/webpack/webpack' -import { FLIGHT_MANIFEST } from '../../../shared/lib/constants' +import { + FLIGHT_MANIFEST, + RSC_CLIENT_ENTRY, +} from '../../../shared/lib/constants' import { relative } from 'path' // This is the module that will be used to anchor all client references to. @@ -176,7 +179,7 @@ export class FlightManifestPlugin { // That way we know by the type of dep whether to include. // It also resolves conflicts when the same module is in multiple chunks. const rscType = mod.buildInfo.rsc?.type - if (rscType !== 'client-entry') return + if (rscType !== RSC_CLIENT_ENTRY) return if (/\/(page|layout)\.(ts|js)x?$/.test(resource)) { entryFilepath = resource diff --git a/packages/next/client/components/app-router.client.tsx b/packages/next/client/components/app-router.client.tsx index fcd92f9c16604..c7ec79e489d79 100644 --- a/packages/next/client/components/app-router.client.tsx +++ b/packages/next/client/components/app-router.client.tsx @@ -1,4 +1,4 @@ -'client-entry' +'client' export const time = '1' diff --git a/packages/next/client/components/hot-reloader.client.tsx b/packages/next/client/components/hot-reloader.client.tsx index b3b8a7129962b..dee184d7e1351 100644 --- a/packages/next/client/components/hot-reloader.client.tsx +++ b/packages/next/client/components/hot-reloader.client.tsx @@ -1,4 +1,4 @@ -'client-entry' +'client' import { useCallback, diff --git a/packages/next/client/components/layout-router.client.tsx b/packages/next/client/components/layout-router.client.tsx index f50dd4beffda5..7176e27e620a5 100644 --- a/packages/next/client/components/layout-router.client.tsx +++ b/packages/next/client/components/layout-router.client.tsx @@ -1,4 +1,4 @@ -'client-entry' +'client' import React, { useContext, useEffect, useRef } from 'react' import type { diff --git a/packages/next/shared/lib/constants.ts b/packages/next/shared/lib/constants.ts index 856c638eac756..b9798bed11de2 100644 --- a/packages/next/shared/lib/constants.ts +++ b/packages/next/shared/lib/constants.ts @@ -95,6 +95,8 @@ export const OPTIMIZED_FONT_PROVIDERS = [ export const STATIC_STATUS_PAGES = ['/500'] export const TRACE_OUTPUT_VERSION = 1 +export const RSC_CLIENT_ENTRY = 'client' + // comparing // https://nextjs.org/docs/api-reference/edge-runtime // with diff --git a/packages/next/taskfile-swc.js b/packages/next/taskfile-swc.js index 2f4c7766795f7..1dbb4361b6117 100644 --- a/packages/next/taskfile-swc.js +++ b/packages/next/taskfile-swc.js @@ -111,11 +111,10 @@ module.exports = function (task) { const originalSource = file.data.toString('utf-8') let output = yield transform(originalSource, options) - const hasClientEntry = /^['"]client-entry['"]/.test(originalSource) + const hasClientEntry = /^['"]client['"]/.test(originalSource) if (options.filename.includes('.client.')) { console.log('hasClientEntry', options.filename, hasClientEntry) - output.code = - (hasClientEntry ? `"client-entry";\n` : '\n') + output.code + output.code = (hasClientEntry ? `"client";\n` : '\n') + output.code } const ext = path.extname(file.base) diff --git a/test/e2e/app-dir/convention/app/client/page.js b/test/e2e/app-dir/convention/app/client/page.js index 427674283d681..c032838a95791 100644 --- a/test/e2e/app-dir/convention/app/client/page.js +++ b/test/e2e/app-dir/convention/app/client/page.js @@ -1,5 +1,5 @@ // bar/page.js should work with client hook -'client-entry' +'client' import { useState } from 'react'