Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: allow tag injection after body open (body-prepend) #1435

Merged
merged 2 commits into from
Jan 9, 2021
+53 −8
Merged

feat: allow tag injection after body open (body-prepend) #1435

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
1615d3b
feat: allow tag injection after body open (body-prepend)
stafyniaksacha Jan 8, 2021
a9456f9
chore: add prepend / append html tag tests
stafyniaksacha Jan 9, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Next Next commit
feat: allow tag injection after body open (body-prepend)
  • Loading branch information
@stafyniaksacha
stafyniaksacha committed Jan 8, 2021
commit 1615d3b7ce0d83c26aa92e13145047fe94322b0c
2 changes: 1 addition & 1 deletion docs/guide/api-plugin.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -269,7 +269,7 @@ Vite plugins can also provide hooks that serve Vite-specific purposes. These hoo
/**
* default: 'head-prepend'
*/
injectTo?: 'head' | 'body' | 'head-prepend'
injectTo?: 'head' | 'body' | 'head-prepend' | 'body-prepend'
}
```

Expand Down
36 changes: 29 additions & 7 deletions packages/vite/src/node/plugins/html.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -316,7 +316,7 @@ export interface HtmlTagDescriptor {
/**
* default: 'head-prepend'
*/
injectTo?: 'head' | 'body' | 'head-prepend'
injectTo?: 'head' | 'body' | 'head-prepend' | 'body-prepend'
}

export type IndexHtmlTransformResult =
Expand Down Expand Up @@ -385,6 +385,7 @@ export async function applyHtmlTransforms(
const headTags: HtmlTagDescriptor[] = []
const headPrependTags: HtmlTagDescriptor[] = []
const bodyTags: HtmlTagDescriptor[] = []
const bodyPrependTags: HtmlTagDescriptor[] = []

const ctx: IndexHtmlTransformContext = {
path,
Expand All @@ -411,6 +412,8 @@ export async function applyHtmlTransforms(
for (const tag of tags) {
if (tag.injectTo === 'body') {
bodyTags.push(tag)
} else if (tag.injectTo === 'body-prepend') {
bodyPrependTags.push(tag)
} else if (tag.injectTo === 'head') {
headTags.push(tag)
} else {
Expand All @@ -427,6 +430,9 @@ export async function applyHtmlTransforms(
if (headTags.length) {
html = injectToHead(html, headTags)
}
if (bodyPrependTags.length) {
html = injectToBody(html, bodyPrependTags, true)
}
if (bodyTags.length) {
html = injectToBody(html, bodyTags)
}
Expand Down Expand Up @@ -464,13 +470,29 @@ function injectToHead(
}

const bodyInjectRE = /<\/body>/
function injectToBody(html: string, tags: HtmlTagDescriptor[]) {
const tagsHtml = `\n` + serializeTags(tags)
if (bodyInjectRE.test(html)) {
return html.replace(bodyInjectRE, `${tagsHtml}\n$&`)
const bodyPrependInjectRE = /<body>/
function injectToBody(
html: string,
tags: HtmlTagDescriptor[],
prepend = false
) {
if (prepend) {
// inject after body open
const tagsHtml = `\n` + serializeTags(tags)
if (bodyPrependInjectRE.test(html)) {
return html.replace(bodyPrependInjectRE, `$&\n${tagsHtml}`)
}
// if no body, prepend
return tagsHtml + `\n` + html
} else {
// inject before body close
const tagsHtml = `\n` + serializeTags(tags)
if (bodyInjectRE.test(html)) {
return html.replace(bodyInjectRE, `${tagsHtml}\n$&`)
}
// if no body, append
return html + `\n` + tagsHtml
}
// if no body, append
return html + `\n` + tagsHtml
}

const unaryTags = new Set(['link', 'meta', 'base'])
Expand Down