From 6ab80f8d06334d6ebd46842f24468edb54172102 Mon Sep 17 00:00:00 2001 From: Jiachi Liu Date: Tue, 9 Aug 2022 03:37:56 +0200 Subject: [PATCH 1/6] typing: upgrade styled-jsx to remove workaround in build script --- packages/next/package.json | 2 +- packages/next/taskfile.js | 19 ++----------------- pnpm-lock.yaml | 8 ++++---- 3 files changed, 7 insertions(+), 22 deletions(-) diff --git a/packages/next/package.json b/packages/next/package.json index 0acc58eedc28..63020bea1c6e 100644 --- a/packages/next/package.json +++ b/packages/next/package.json @@ -257,7 +257,7 @@ "string-hash": "1.1.3", "string_decoder": "1.3.0", "strip-ansi": "6.0.0", - "styled-jsx": "5.0.2", + "styled-jsx": "5.0.3", "tar": "6.1.11", "taskr": "1.1.0", "terser": "5.14.1", diff --git a/packages/next/taskfile.js b/packages/next/taskfile.js index 198100f9a0cb..b299ecf34c4d 100644 --- a/packages/next/taskfile.js +++ b/packages/next/taskfile.js @@ -44,7 +44,7 @@ export async function copy_regenerator_runtime(task, opts) { // eslint-disable-next-line camelcase export async function copy_styled_jsx_assets(task, opts) { - // we copy the styled-jsx types so that we can reference them + // we copy the styled-jsx assets and types so that we can reference them // in the next-env.d.ts file so it doesn't matter if the styled-jsx // package is hoisted out of Next.js' node_modules or not const styledJsxPath = dirname(require.resolve('styled-jsx/package.json')) @@ -60,22 +60,7 @@ export async function copy_styled_jsx_assets(task, opts) { for (const file of typeFiles) { const fileNoExt = file.replace(/\.d\.ts/, '') const content = await fs.readFile(join(styledJsxPath, file), 'utf8') - const exportsIndex = content.indexOf('export') - - let replacedContent = - `${content.substring(0, exportsIndex)}\n` + - `declare module 'styled-jsx${ - file === 'index.d.ts' ? '' : '/' + fileNoExt - }' { - ${content.substring(exportsIndex)} - }` - if (file === 'index.d.ts') { - replacedContent = replacedContent - .replace(/export function StyleRegistry/g, 'export function IRegistry') - .replace(/StyleRegistry/g, 'IStyleRegistry') - .replace(/IRegistry/g, 'Registry') - } - await fs.writeFile(join(outputDir, file), replacedContent) + await fs.writeFile(join(outputDir, file), content) typeReferences += `/// \n` } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index b1b29baf8d4b..c723f18aa8d4 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -561,7 +561,7 @@ importers: string_decoder: 1.3.0 string-hash: 1.1.3 strip-ansi: 6.0.0 - styled-jsx: 5.0.2 + styled-jsx: 5.0.3 tar: 6.1.11 taskr: 1.1.0 terser: 5.14.1 @@ -750,7 +750,7 @@ importers: string_decoder: 1.3.0 string-hash: 1.1.3 strip-ansi: 6.0.0 - styled-jsx: 5.0.2_@babel+core@7.18.0 + styled-jsx: 5.0.3_@babel+core@7.18.0 tar: 6.1.11 taskr: 1.1.0 terser: 5.14.1 @@ -20560,8 +20560,8 @@ packages: postcss-load-plugins: 2.3.0 dev: true - /styled-jsx/5.0.2_@babel+core@7.18.0: - resolution: {integrity: sha512-LqPQrbBh3egD57NBcHET4qcgshPks+yblyhPlH2GY8oaDgKs8SK4C3dBh3oSJjgzJ3G5t1SYEZGHkP+QEpX9EQ==} + /styled-jsx/5.0.3_@babel+core@7.18.0: + resolution: {integrity: sha512-v82oihjxFj2WJtQiodZIDjJpnmVcE71HTCVylxdcQHU0ocnI0rGhJ0+5A3311NMQUx0KFJ+18RSHNlfIgcSU8g==} engines: {node: '>= 12.0.0'} peerDependencies: '@babel/core': '*' From 378294e7a0c65ca2a598bb33f8b3f80df549ab32 Mon Sep 17 00:00:00 2001 From: Jiachi Liu Date: Tue, 9 Aug 2022 11:14:11 +0200 Subject: [PATCH 2/6] rename declared module --- packages/next/taskfile.js | 12 ++++++++++-- packages/next/types/misc.d.ts | 5 ----- 2 files changed, 10 insertions(+), 7 deletions(-) diff --git a/packages/next/taskfile.js b/packages/next/taskfile.js index b299ecf34c4d..9a7dc771287c 100644 --- a/packages/next/taskfile.js +++ b/packages/next/taskfile.js @@ -53,13 +53,21 @@ export async function copy_styled_jsx_assets(task, opts) { cwd: styledJsxPath, }) const outputDir = join(__dirname, 'dist/styled-jsx') - let typeReferences = `` + let typeReferences = '' await fs.ensureDir(outputDir) for (const file of typeFiles) { + // Port `declare module 'styled-jsx'` to `declare module 'next/dist/styled-jsx'` const fileNoExt = file.replace(/\.d\.ts/, '') - const content = await fs.readFile(join(styledJsxPath, file), 'utf8') + const content = ( + await fs.readFile(join(styledJsxPath, file), 'utf8') + ).replace( + `declare module 'styled-jsx${ + fileNoExt === 'index' ? '' : `/${fileNoExt}` + }'`, + `declare module 'next/dist/styled-jsx/${fileNoExt}'` + ) await fs.writeFile(join(outputDir, file), content) typeReferences += `/// \n` } diff --git a/packages/next/types/misc.d.ts b/packages/next/types/misc.d.ts index 02a3d342988c..131c9577276f 100644 --- a/packages/next/types/misc.d.ts +++ b/packages/next/types/misc.d.ts @@ -18,11 +18,6 @@ declare module 'next/dist/compiled/@next/react-refresh-utils/dist/ReactRefreshWe export = m } -declare module 'next/dist/styled-jsx' { - import m from 'styled-jsx' - export = m -} - declare module 'next/dist/compiled/node-html-parser' { export * from 'node-html-parser' } From 6eb8b8d330d8ce849e89421b232483c8e44f5f7c Mon Sep 17 00:00:00 2001 From: Jiachi Liu Date: Tue, 9 Aug 2022 12:01:02 +0200 Subject: [PATCH 3/6] change styled-jsx import path --- packages/next/server/render.tsx | 2 +- packages/next/taskfile.js | 9 +-------- 2 files changed, 2 insertions(+), 9 deletions(-) diff --git a/packages/next/server/render.tsx b/packages/next/server/render.tsx index 42bf8bf58490..f770e6e6a9bf 100644 --- a/packages/next/server/render.tsx +++ b/packages/next/server/render.tsx @@ -28,7 +28,7 @@ import type { UnwrapPromise } from '../lib/coalesced-function' import type { ReactReadableStream } from './node-web-streams-helper' import React from 'react' -import { StyleRegistry, createStyleRegistry } from 'next/dist/styled-jsx' +import { StyleRegistry, createStyleRegistry } from 'styled-jsx' import { GSP_NO_RETURNED_VALUE, GSSP_COMPONENT_MEMBER_ERROR, diff --git a/packages/next/taskfile.js b/packages/next/taskfile.js index 9a7dc771287c..5a5ceeea187c 100644 --- a/packages/next/taskfile.js +++ b/packages/next/taskfile.js @@ -60,14 +60,7 @@ export async function copy_styled_jsx_assets(task, opts) { for (const file of typeFiles) { // Port `declare module 'styled-jsx'` to `declare module 'next/dist/styled-jsx'` const fileNoExt = file.replace(/\.d\.ts/, '') - const content = ( - await fs.readFile(join(styledJsxPath, file), 'utf8') - ).replace( - `declare module 'styled-jsx${ - fileNoExt === 'index' ? '' : `/${fileNoExt}` - }'`, - `declare module 'next/dist/styled-jsx/${fileNoExt}'` - ) + const content = await fs.readFile(join(styledJsxPath, file), 'utf8') await fs.writeFile(join(outputDir, file), content) typeReferences += `/// \n` } From 12e6d2072b76c482103f76ce716d85fdfb2fbb83 Mon Sep 17 00:00:00 2001 From: Jiachi Liu Date: Tue, 9 Aug 2022 12:01:55 +0200 Subject: [PATCH 4/6] rm comment --- packages/next/taskfile.js | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/next/taskfile.js b/packages/next/taskfile.js index 5a5ceeea187c..6d88e1d8ab3a 100644 --- a/packages/next/taskfile.js +++ b/packages/next/taskfile.js @@ -58,7 +58,6 @@ export async function copy_styled_jsx_assets(task, opts) { await fs.ensureDir(outputDir) for (const file of typeFiles) { - // Port `declare module 'styled-jsx'` to `declare module 'next/dist/styled-jsx'` const fileNoExt = file.replace(/\.d\.ts/, '') const content = await fs.readFile(join(styledJsxPath, file), 'utf8') await fs.writeFile(join(outputDir, file), content) From 2ffdb4709fb95f282d1182f18d49804383e20e8f Mon Sep 17 00:00:00 2001 From: Jiachi Liu Date: Tue, 9 Aug 2022 17:58:22 +0200 Subject: [PATCH 5/6] separate types folders --- packages/next/index.d.ts | 2 +- packages/next/server/render.tsx | 2 +- packages/next/taskfile.js | 15 ++++++++++++--- packages/next/types/misc.d.ts | 5 +++++ 4 files changed, 19 insertions(+), 5 deletions(-) diff --git a/packages/next/index.d.ts b/packages/next/index.d.ts index 5d7a7b9cd205..cba2b1dd4e05 100644 --- a/packages/next/index.d.ts +++ b/packages/next/index.d.ts @@ -1,5 +1,5 @@ /// -/// +/// /// /// /// diff --git a/packages/next/server/render.tsx b/packages/next/server/render.tsx index f770e6e6a9bf..42bf8bf58490 100644 --- a/packages/next/server/render.tsx +++ b/packages/next/server/render.tsx @@ -28,7 +28,7 @@ import type { UnwrapPromise } from '../lib/coalesced-function' import type { ReactReadableStream } from './node-web-streams-helper' import React from 'react' -import { StyleRegistry, createStyleRegistry } from 'styled-jsx' +import { StyleRegistry, createStyleRegistry } from 'next/dist/styled-jsx' import { GSP_NO_RETURNED_VALUE, GSSP_COMPONENT_MEMBER_ERROR, diff --git a/packages/next/taskfile.js b/packages/next/taskfile.js index 6d88e1d8ab3a..ef94fb0cd528 100644 --- a/packages/next/taskfile.js +++ b/packages/next/taskfile.js @@ -53,18 +53,22 @@ export async function copy_styled_jsx_assets(task, opts) { cwd: styledJsxPath, }) const outputDir = join(__dirname, 'dist/styled-jsx') + // Separate type files into different folders to avoid conflicts between + // dev dep `styled-jsx` and `next/dist/styled-jsx` for duplicated declare modules + const typesDir = join(outputDir, 'types') let typeReferences = '' await fs.ensureDir(outputDir) + await fs.ensureDir(typesDir) for (const file of typeFiles) { const fileNoExt = file.replace(/\.d\.ts/, '') const content = await fs.readFile(join(styledJsxPath, file), 'utf8') - await fs.writeFile(join(outputDir, file), content) + await fs.writeFile(join(typesDir, file), content) typeReferences += `/// \n` } - await fs.writeFile(join(outputDir, 'global.d.ts'), typeReferences) + await fs.writeFile(join(typesDir, 'global.d.ts'), typeReferences) for (const file of jsFiles) { const content = await fs.readFile(join(styledJsxPath, file), 'utf8') @@ -1791,7 +1795,12 @@ export async function path_to_regexp(task, opts) { export async function precompile(task, opts) { await task.parallel( - ['browser_polyfills', 'path_to_regexp', 'copy_ncced'], + [ + 'browser_polyfills', + 'path_to_regexp', + 'copy_ncced', + 'copy_styled_jsx_assets', + ], opts ) } diff --git a/packages/next/types/misc.d.ts b/packages/next/types/misc.d.ts index 131c9577276f..e13257f7bee3 100644 --- a/packages/next/types/misc.d.ts +++ b/packages/next/types/misc.d.ts @@ -284,6 +284,11 @@ declare module 'next/dist/compiled/postcss-scss' { import m from 'postcss-scss' export = m } +declare module 'next/dist/styled-jsx' { + import m from 'styled-jsx' + export = m +} + declare module 'next/dist/compiled/text-table' { function textTable( rows: Array>, From afeab1a7631cc73ce854b5baed6ffcf173aed67c Mon Sep 17 00:00:00 2001 From: Jiachi Liu Date: Tue, 9 Aug 2022 18:17:35 +0200 Subject: [PATCH 6/6] move task --- packages/next/taskfile.js | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/next/taskfile.js b/packages/next/taskfile.js index ef94fb0cd528..67f660129e6e 100644 --- a/packages/next/taskfile.js +++ b/packages/next/taskfile.js @@ -1959,7 +1959,6 @@ export async function compile(task, opts) { // we compile this each time so that fresh runtime data is pulled // before each publish 'ncc_amp_optimizer', - 'copy_styled_jsx_assets', ], opts )