diff --git a/docs/config/app-configs.md b/docs/config/app-configs.md index d4b6cd6f988..3e44f4c8134 100644 --- a/docs/config/app-configs.md +++ b/docs/config/app-configs.md @@ -257,22 +257,19 @@ VitePress build hooks allow you to add new functionality and behaviors to your w ### transformHead -- Type: `( ctx: TransformContext ) => Awaitable` +- Type: `(ctx: TransformContext) => Awaitable` -`transformHead` is a build hook to transform the head before rendering each page: it will allow you to add head entries that cannot be statically added to your VitePress config module. +`transformHead` is a build hook to transform the head before generating each page. It will allow you to add head entries that cannot be statically added to your VitePress config. You only need to return extra entries, they will be merged automatically with the existing ones. ::: warning -The `head` provided in `TransformContext` is a clone, any headers you want to include on all pages will need to be added on each call. +Don't mutate anything inside the `ctx`. ::: ```ts -import { defineConfig } from 'vitepress' - -export default defineConfig({ - /* other vitepress options */ +export default { async transformHead(ctx) { } -}) +} ``` ```ts @@ -283,32 +280,24 @@ interface TransformContext { title: string description: string head: HeadConfig[] + content: string } ``` ### transformHtml -- Type: `( code: string, id: string, ctx: HtmlTransformContext ) => Awaitable` +- Type: `(code: string, id: string, ctx: TransformContext) => Awaitable` -`transformHtml` is a build hook to transform the content of each page before saving to disk (SSG). +`transformHtml` is a build hook to transform the content of each page before saving to disk. ::: warning Modifying the html content may cause hydration problems in runtime. ::: ```ts -import { defineConfig } from 'vitepress' - -export default defineConfig({ - /* other vitepress options */ +export default { async transformHtml(code, id, context) { } -}) -``` - -```ts -interface HtmlTransformContext extends TransformContext { - content: string } ``` @@ -319,11 +308,8 @@ interface HtmlTransformContext extends TransformContext { `buildEnd` is a build CLI hook, it will run after build (SSG) finish but before VitePress CLI process exits. ```ts -import { defineConfig } from 'vitepress' - -export default defineConfig({ - /* other vitepress options */ +export default { async buildEnd(siteConfig) { } -}) +} ``` diff --git a/src/node/build/render.ts b/src/node/build/render.ts index 04b795c69dc..238bb0fff45 100644 --- a/src/node/build/render.ts +++ b/src/node/build/render.ts @@ -106,23 +106,22 @@ export async function renderPage( const title: string = createTitle(siteData, pageData) const description: string = pageData.description || siteData.description - let useHead = siteData.head - if (config.transformHead) { - // make a copy of the head - useHead = Array.from(siteData.head) - await config.transformHead({ + const headBeforeTransform = mergeHead( + siteData.head, + filterOutHeadDescription(pageData.frontmatter.head) + ) + + const head = mergeHead( + headBeforeTransform, + (await config.transformHead?.({ siteConfig: config, siteData, pageData, title, description, - head: useHead - }) - } - - const head = mergeHead( - useHead, - filterOutHeadDescription(pageData.frontmatter.head) + head: headBeforeTransform, + content + })) || [] ) let inlinedScript = '' diff --git a/src/node/config.ts b/src/node/config.ts index c7a211c1779..8d1f73e1428 100644 --- a/src/node/config.ts +++ b/src/node/config.ts @@ -98,7 +98,7 @@ export interface UserConfig { * * This build hook will allow you to modify the head adding new entries that cannot be statically added. */ - transformHead?: (ctx: TransformContext) => Awaitable + transformHead?: (ctx: TransformContext) => Awaitable /** * HTML transform hook: runs before writing HTML to dist. @@ -106,7 +106,7 @@ export interface UserConfig { transformHtml?: ( code: string, id: string, - ctx: HtmlTransformContext + ctx: TransformContext ) => Awaitable } @@ -117,9 +117,6 @@ export interface TransformContext { title: string description: string head: HeadConfig[] -} - -export interface HtmlTransformContext extends TransformContext { content: string }