diff --git a/src/plugins/prerender-plugin.js b/src/plugins/prerender-plugin.js index 4c8bc22..0c5102a 100644 --- a/src/plugins/prerender-plugin.js +++ b/src/plugins/prerender-plugin.js @@ -383,7 +383,7 @@ export function prerenderPlugin({ prerenderScript, renderTarget, additionalPrere }; /** @type {import('./types.d.ts').Head} */ - let head = { lang: '', title: '', elements: new Set() }; + let head = { lang: '', title: '', elements: new Set(), startElements: new Set() }; let prerender; try { @@ -435,7 +435,7 @@ export function prerenderPlugin({ prerenderScript, renderTarget, additionalPrere // Reset HTML doc & head data const htmlDoc = htmlParse(tpl, { comment: true }); - head = { lang: '', title: '', elements: new Set() }; + head = { lang: '', title: '', elements: new Set(), startElements: new Set() }; // Add any discovered links to the list of routes to pre-render: if (result.links) { @@ -480,6 +480,16 @@ export function prerenderPlugin({ prerenderScript, renderTarget, additionalPrere htmlDoc.querySelector('html').setAttribute('lang', enc(head.lang)); } + if (head.startElements) { + // Inject HTML links at the start of for any stylesheets injected during rendering of the page: + htmlHead.insertAdjacentHTML( + 'afterbegin', + Array.from( + new Set(Array.from(head.startElements).map(serializeElement)), + ).join('\n'), + ); + } + if (head.elements) { // Inject HTML links at the end of for any stylesheets injected during rendering of the page: htmlHead.insertAdjacentHTML( diff --git a/src/plugins/types.d.ts b/src/plugins/types.d.ts index d13ad3c..9525c1e 100644 --- a/src/plugins/types.d.ts +++ b/src/plugins/types.d.ts @@ -7,6 +7,13 @@ export interface HeadElement { export interface Head { lang: string; title: string; + /** + * Which elements should be injected in the **start** of + */ + startElements: Set; + /** + * Which elements should be injected in the **end** of + */ elements: Set; } diff --git a/tests/prerender-api.test.js b/tests/prerender-api.test.js index bf6bf13..3553a88 100644 --- a/tests/prerender-api.test.js +++ b/tests/prerender-api.test.js @@ -94,6 +94,29 @@ test('Should support `head.title` property', async () => { assert.match(prerenderedHtml, 'My Prerendered Site'); }); +test('Should support `head.startElements` property', async () => { + await loadFixture('simple', env); + await writeEntry( + env.tmp.path, + ` + export async function prerender() { + return { + html: '

Hello, World!

', + head: { + startElements: new Set([ + { type: 'link', props: { rel: 'stylesheet', href: 'foo.css' } }, + ]), + }, + }; + } + `, + ); + await viteBuild(env.tmp.path); + + const prerenderedHtml = await getOutputFile(env.tmp.path, 'index.html'); + assert.match(prerenderedHtml, ''); +}); + test('Should support `head.elements` property', async () => { await loadFixture('simple', env); await writeEntry(env.tmp.path, `