From 57b1a9690a4e8707868126918dded7869b0831c1 Mon Sep 17 00:00:00 2001 From: patak-js Date: Mon, 20 Sep 2021 23:57:15 +0200 Subject: [PATCH 1/2] fix: injected tags indentation --- packages/vite/src/node/plugins/html.ts | 63 ++++++++++++++++++-------- 1 file changed, 43 insertions(+), 20 deletions(-) diff --git a/packages/vite/src/node/plugins/html.ts b/packages/vite/src/node/plugins/html.ts index 9ec7282340e51e..18a2c3c309a7f9 100644 --- a/packages/vite/src/node/plugins/html.ts +++ b/packages/vite/src/node/plugins/html.ts @@ -590,33 +590,39 @@ function toPublicPath(filename: string, config: ResolvedConfig) { return isExternalUrl(filename) ? filename : config.base + filename } -const headInjectRE = /<\/head>/ -const headPrependInjectRE = [//, //i] +const headInjectRE = /([ \t]*)<\/head>/ +const headPrependInjectRE = [/([ \t]*)/, //i] function injectToHead( html: string, tags: HtmlTagDescriptor[], prepend = false ) { - const tagsHtml = serializeTags(tags) if (prepend) { // inject after head or doctype for (const re of headPrependInjectRE) { if (re.test(html)) { - return html.replace(re, `$&\n${tagsHtml}`) + return html.replace( + re, + (match, p1) => `${match}\n${serializeTags(tags, incrementIndent(p1))}` + ) } } } else { // inject before head close if (headInjectRE.test(html)) { - return html.replace(headInjectRE, `${tagsHtml}\n $&`) + // respect indentation of head tag + return html.replace( + headInjectRE, + (match, p1) => `${serializeTags(tags, incrementIndent(p1))}${match}` + ) } } // if no tag is present, just prepend - return tagsHtml + `\n` + html + return serializeTags(tags) + html } -const bodyInjectRE = /<\/body>/ -const bodyPrependInjectRE = /]*>/ +const bodyInjectRE = /([ \t]*)<\/body>/ +const bodyPrependInjectRE = /([ \t]*)]*>/ function injectToBody( html: string, tags: HtmlTagDescriptor[], @@ -624,38 +630,51 @@ function injectToBody( ) { if (prepend) { // inject after body open - const tagsHtml = `\n` + serializeTags(tags) if (bodyPrependInjectRE.test(html)) { - return html.replace(bodyPrependInjectRE, `$&\n${tagsHtml}`) + return html.replace( + bodyPrependInjectRE, + (match, p1) => `${match}\n${serializeTags(tags, incrementIndent(p1))}` + ) } // if no body, prepend - return tagsHtml + `\n` + html + return serializeTags(tags) + html } else { // inject before body close - const tagsHtml = `\n` + serializeTags(tags) if (bodyInjectRE.test(html)) { - return html.replace(bodyInjectRE, `${tagsHtml}\n$&`) + return html.replace( + bodyInjectRE, + (match, p1) => `${serializeTags(tags, incrementIndent(p1))}${match}` + ) } // if no body, append - return html + `\n` + tagsHtml + return html + `\n` + serializeTags(tags) } } const unaryTags = new Set(['link', 'meta', 'base']) -function serializeTag({ tag, attrs, children }: HtmlTagDescriptor): string { +function serializeTag( + { tag, attrs, children }: HtmlTagDescriptor, + indent: string = '' +): string { if (unaryTags.has(tag)) { - return `<${tag}${serializeAttrs(attrs)}>` + return `${indent}<${tag}${serializeAttrs(attrs)}>` } else { - return `<${tag}${serializeAttrs(attrs)}>${serializeTags(children)}` + return `${indent}<${tag}${serializeAttrs(attrs)}>${serializeTags( + children, + incrementIndent(indent) + )}` } } -function serializeTags(tags: HtmlTagDescriptor['children']): string { +function serializeTags( + tags: HtmlTagDescriptor['children'], + indent: string = '' +): string { if (typeof tags === 'string') { return tags - } else if (tags) { - return ` ${tags.map(serializeTag).join('\n ')}` + } else if (tags && tags.length) { + return `${tags.map((tag) => serializeTag(tag, indent)).join('\n')}\n` } return '' } @@ -671,3 +690,7 @@ function serializeAttrs(attrs: HtmlTagDescriptor['attrs']): string { } return res } + +function incrementIndent(indent: string = '') { + return `${indent}${indent[0] === '\t' ? '\t' : ' '}` +} From fe41b555bbb36743d3118cdaaaf9507d49902d71 Mon Sep 17 00:00:00 2001 From: Matias Capeletto Date: Tue, 21 Sep 2021 11:50:26 +0200 Subject: [PATCH 2/2] refactor: apply suggestion --- packages/vite/src/node/plugins/html.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/vite/src/node/plugins/html.ts b/packages/vite/src/node/plugins/html.ts index 18a2c3c309a7f9..802233a9f68fd4 100644 --- a/packages/vite/src/node/plugins/html.ts +++ b/packages/vite/src/node/plugins/html.ts @@ -658,9 +658,9 @@ function serializeTag( indent: string = '' ): string { if (unaryTags.has(tag)) { - return `${indent}<${tag}${serializeAttrs(attrs)}>` + return `<${tag}${serializeAttrs(attrs)}>` } else { - return `${indent}<${tag}${serializeAttrs(attrs)}>${serializeTags( + return `<${tag}${serializeAttrs(attrs)}>${serializeTags( children, incrementIndent(indent) )}` @@ -674,7 +674,7 @@ function serializeTags( if (typeof tags === 'string') { return tags } else if (tags && tags.length) { - return `${tags.map((tag) => serializeTag(tag, indent)).join('\n')}\n` + return tags.map((tag) => `${indent}${serializeTag(tag, indent)}\n`).join('') } return '' }