From 9f8e8b850e1fa559a18bea566db27e47cac0ce35 Mon Sep 17 00:00:00 2001 From: Anthony Fu Date: Tue, 23 Aug 2022 15:52:21 +0800 Subject: [PATCH 1/5] feat: rebase --- docs/guide/api-plugin.md | 2 +- packages/vite/src/node/plugin.ts | 2 +- packages/vite/src/node/plugins/html.ts | 52 +++++++++++++------ .../src/node/server/middlewares/indexHtml.ts | 5 +- playground/html/vite.config.js | 4 +- 5 files changed, 45 insertions(+), 20 deletions(-) diff --git a/docs/guide/api-plugin.md b/docs/guide/api-plugin.md index c18c6daca3263f..cd43e14c7200b2 100644 --- a/docs/guide/api-plugin.md +++ b/docs/guide/api-plugin.md @@ -329,7 +329,7 @@ Vite plugins can also provide hooks that serve Vite-specific purposes. These hoo ### `transformIndexHtml` -- **Type:** `IndexHtmlTransformHook | { enforce?: 'pre' | 'post', transform: IndexHtmlTransformHook }` +- **Type:** `IndexHtmlTransformHook | { order?: 'pre' | 'post', handler: IndexHtmlTransformHook }` - **Kind:** `async`, `sequential` Dedicated hook for transforming HTML entry point files such as `index.html`. The hook receives the current HTML string and a transform context. The context exposes the [`ViteDevServer`](./api-javascript#vitedevserver) instance during dev, and exposes the Rollup output bundle during build. diff --git a/packages/vite/src/node/plugin.ts b/packages/vite/src/node/plugin.ts index a30006ec7915f5..4fcf924e72fe14 100644 --- a/packages/vite/src/node/plugin.ts +++ b/packages/vite/src/node/plugin.ts @@ -106,7 +106,7 @@ export interface Plugin extends RollupPlugin { * * By default the transform is applied **after** vite's internal html * transform. If you need to apply the transform before vite, use an object: - * `{ enforce: 'pre', transform: hook }` + * `{ order: 'pre', handler: hook }` */ transformIndexHtml?: IndexHtmlTransform /** diff --git a/packages/vite/src/node/plugins/html.ts b/packages/vite/src/node/plugins/html.ts index 4c46d988890462..f4fe5bfee4089a 100644 --- a/packages/vite/src/node/plugins/html.ts +++ b/packages/vite/src/node/plugins/html.ts @@ -229,7 +229,9 @@ function handleParseError( * Compiles index.html into an entry js module */ export function buildHtmlPlugin(config: ResolvedConfig): Plugin { - const [preHooks, postHooks] = resolveHtmlTransforms(config.plugins) + const [preHooks, normalHooks, postHooks] = resolveHtmlTransforms( + config.plugins + ) preHooks.unshift(preImportMapHook(config)) postHooks.push(postImportMapHook()) const processedHtml = new Map() @@ -721,12 +723,16 @@ export function buildHtmlPlugin(config: ResolvedConfig): Plugin { if (s) { result = s.toString() } - result = await applyHtmlTransforms(result, postHooks, { - path: '/' + relativeUrlPath, - filename: id, - bundle, - chunk - }) + result = await applyHtmlTransforms( + result, + [...normalHooks, ...postHooks], + { + path: '/' + relativeUrlPath, + filename: id, + bundle, + chunk + } + ) // resolve asset url references result = result.replace(assetUrlRE, (_, fileHash, postfix = '') => { return ( @@ -799,6 +805,11 @@ export type IndexHtmlTransformHook = ( export type IndexHtmlTransform = | IndexHtmlTransformHook | { + order?: 'pre' | 'post' | null + handler: IndexHtmlTransformHook + /** + * @deprecated renamed to `order` + */ enforce?: 'pre' | 'post' transform: IndexHtmlTransformHook } @@ -850,24 +861,35 @@ export function postImportMapHook(): IndexHtmlTransformHook { export function resolveHtmlTransforms( plugins: readonly Plugin[] -): [IndexHtmlTransformHook[], IndexHtmlTransformHook[]] { +): [ + IndexHtmlTransformHook[], + IndexHtmlTransformHook[], + IndexHtmlTransformHook[] +] { const preHooks: IndexHtmlTransformHook[] = [] + const normalHooks: IndexHtmlTransformHook[] = [] const postHooks: IndexHtmlTransformHook[] = [] for (const plugin of plugins) { const hook = plugin.transformIndexHtml - if (hook) { - if (typeof hook === 'function') { - postHooks.push(hook) - } else if (hook.enforce === 'pre') { - preHooks.push(hook.transform) + if (!hook) continue + + if (typeof hook === 'function') { + normalHooks.push(hook) + } else { + const order = hook.order ?? hook.enforce + const handler = hook.handler ?? hook.transform + if (order === 'pre') { + preHooks.push(handler) + } else if (order === 'post') { + postHooks.push(handler) } else { - postHooks.push(hook.transform) + normalHooks.push(handler) } } } - return [preHooks, postHooks] + return [preHooks, normalHooks, postHooks] } export async function applyHtmlTransforms( diff --git a/packages/vite/src/node/server/middlewares/indexHtml.ts b/packages/vite/src/node/server/middlewares/indexHtml.ts index 618cf653cfb7d8..722c14c12a613c 100644 --- a/packages/vite/src/node/server/middlewares/indexHtml.ts +++ b/packages/vite/src/node/server/middlewares/indexHtml.ts @@ -43,7 +43,9 @@ interface AssetNode { export function createDevHtmlTransformFn( server: ViteDevServer ): (url: string, html: string, originalUrl: string) => Promise { - const [preHooks, postHooks] = resolveHtmlTransforms(server.config.plugins) + const [preHooks, normalHooks, postHooks] = resolveHtmlTransforms( + server.config.plugins + ) return (url: string, html: string, originalUrl: string): Promise => { return applyHtmlTransforms( html, @@ -51,6 +53,7 @@ export function createDevHtmlTransformFn( preImportMapHook(server.config), ...preHooks, devHtmlHook, + ...normalHooks, ...postHooks, postImportMapHook() ], diff --git a/playground/html/vite.config.js b/playground/html/vite.config.js index c294e45ad424f5..768a50bf16c85d 100644 --- a/playground/html/vite.config.js +++ b/playground/html/vite.config.js @@ -35,8 +35,8 @@ module.exports = { { name: 'pre-transform', transformIndexHtml: { - enforce: 'pre', - transform(html, { filename }) { + order: 'pre', + handler(html, { filename }) { if (html.includes('/@vite/client')) { throw new Error('pre transform applied at wrong time!') } From 83bf06e7480003cc9f1800433800a04369859570 Mon Sep 17 00:00:00 2001 From: Anthony Fu Date: Wed, 24 Aug 2022 09:26:24 +0800 Subject: [PATCH 2/5] Update packages/vite/src/node/plugins/html.ts MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: 翠 / green --- packages/vite/src/node/plugins/html.ts | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/packages/vite/src/node/plugins/html.ts b/packages/vite/src/node/plugins/html.ts index f4fe5bfee4089a..5901619c21216a 100644 --- a/packages/vite/src/node/plugins/html.ts +++ b/packages/vite/src/node/plugins/html.ts @@ -806,13 +806,23 @@ export type IndexHtmlTransform = | IndexHtmlTransformHook | { order?: 'pre' | 'post' | null - handler: IndexHtmlTransformHook /** * @deprecated renamed to `order` */ enforce?: 'pre' | 'post' + /** + * @deprecated renamed to `handler` + */ transform: IndexHtmlTransformHook } + | { + order?: 'pre' | 'post' | null + /** + * @deprecated renamed to `order` + */ + enforce?: 'pre' | 'post' + handler: IndexHtmlTransformHook + } export function preImportMapHook( config: ResolvedConfig From a824406ffd7140cc0ab6edc06cb306b21a12d948 Mon Sep 17 00:00:00 2001 From: Anthony Fu Date: Wed, 24 Aug 2022 09:32:40 +0800 Subject: [PATCH 3/5] chore: fix error --- packages/vite/src/node/plugins/html.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/vite/src/node/plugins/html.ts b/packages/vite/src/node/plugins/html.ts index 5901619c21216a..89de834775358e 100644 --- a/packages/vite/src/node/plugins/html.ts +++ b/packages/vite/src/node/plugins/html.ts @@ -888,6 +888,7 @@ export function resolveHtmlTransforms( normalHooks.push(hook) } else { const order = hook.order ?? hook.enforce + // @ts-expect-error union type const handler = hook.handler ?? hook.transform if (order === 'pre') { preHooks.push(handler) From 0b74ff028be5fce5127c898d99af8c652acca6fd Mon Sep 17 00:00:00 2001 From: Anthony Fu Date: Thu, 25 Aug 2022 21:48:12 +0800 Subject: [PATCH 4/5] Update packages/vite/src/node/plugins/html.ts Co-authored-by: patak --- packages/vite/src/node/plugins/html.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/vite/src/node/plugins/html.ts b/packages/vite/src/node/plugins/html.ts index 89de834775358e..546e004f5cb00a 100644 --- a/packages/vite/src/node/plugins/html.ts +++ b/packages/vite/src/node/plugins/html.ts @@ -887,7 +887,7 @@ export function resolveHtmlTransforms( if (typeof hook === 'function') { normalHooks.push(hook) } else { - const order = hook.order ?? hook.enforce + const order = hook.order ?? (hook.enforce === 'pre' ? 'pre' : undefined) // @ts-expect-error union type const handler = hook.handler ?? hook.transform if (order === 'pre') { From 05c8aca109fc71ddc1a6ffeadddf528a4e10a8a6 Mon Sep 17 00:00:00 2001 From: Anthony Fu Date: Thu, 25 Aug 2022 21:55:56 +0800 Subject: [PATCH 5/5] Update packages/vite/src/node/plugins/html.ts Co-authored-by: patak --- packages/vite/src/node/plugins/html.ts | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/packages/vite/src/node/plugins/html.ts b/packages/vite/src/node/plugins/html.ts index 546e004f5cb00a..0073369027552b 100644 --- a/packages/vite/src/node/plugins/html.ts +++ b/packages/vite/src/node/plugins/html.ts @@ -887,6 +887,10 @@ export function resolveHtmlTransforms( if (typeof hook === 'function') { normalHooks.push(hook) } else { + // `enforce` had only two possible values for the `transformIndexHtml` hook + // `'pre'` and `'post'` (the default). `order` now works with three values + // to align with other hooks (`'pre'`, normal, and `'post'`). We map + // both `enforce: 'post'` to `order: undefined` to avoid a breaking change const order = hook.order ?? (hook.enforce === 'pre' ? 'pre' : undefined) // @ts-expect-error union type const handler = hook.handler ?? hook.transform