From b2954009f48da0a0d3202eee802e51eb7a1fb6c5 Mon Sep 17 00:00:00 2001
From: Evan You <yyx990803@gmail.com>
Date: Thu, 7 Jan 2021 15:31:42 -0500
Subject: [PATCH] fix: preserve html comments during dev

fix #1420
---
 packages/playground/html/__tests__/html.spec.ts        | 6 ++++++
 packages/playground/html/index.html                    | 2 ++
 packages/vite/src/node/server/middlewares/indexHtml.ts | 8 +++++++-
 3 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/packages/playground/html/__tests__/html.spec.ts b/packages/playground/html/__tests__/html.spec.ts
index e5d81734411a99..232e7b7b8fe68d 100644
--- a/packages/playground/html/__tests__/html.spec.ts
+++ b/packages/playground/html/__tests__/html.spec.ts
@@ -63,6 +63,12 @@ function testPage(isNested: boolean) {
 
 describe('main', () => {
   testPage(false)
+
+  test('preserve comments', async () => {
+    const html = await page.innerHTML('body')
+    expect(html).toMatch(`<!-- comment one -->`)
+    expect(html).toMatch(`<!-- comment two -->`)
+  })
 })
 
 describe('nested', () => {
diff --git a/packages/playground/html/index.html b/packages/playground/html/index.html
index 8b13222e3ca2f9..b947033587e2d0 100644
--- a/packages/playground/html/index.html
+++ b/packages/playground/html/index.html
@@ -1,5 +1,7 @@
 <link rel="stylesheet" href="./main.css">
 
+<!-- comment one -->
 <h1>Hello</h1>
+<!-- comment two -->
 
 <script type="module" src="./main.js"></script>
\ No newline at end of file
diff --git a/packages/vite/src/node/server/middlewares/indexHtml.ts b/packages/vite/src/node/server/middlewares/indexHtml.ts
index cbcb95eca2406d..d0d1d3c43f4923 100644
--- a/packages/vite/src/node/server/middlewares/indexHtml.ts
+++ b/packages/vite/src/node/server/middlewares/indexHtml.ts
@@ -15,8 +15,13 @@ import { CLIENT_PUBLIC_PATH, FS_PREFIX } from '../../constants'
 
 const devHtmlHook: IndexHtmlTransformHook = (html, { path }) => {
   let index = -1
+  const comments: string[] = []
+
   html = html
-    .replace(htmlCommentRE, '')
+    .replace(htmlCommentRE, (m) => {
+      comments.push(m)
+      return `<!--VITE_COMMENT_${comments.length - 1}-->`
+    })
     .replace(scriptRE, (_match, _openTag, script) => {
       index++
       if (script) {
@@ -25,6 +30,7 @@ const devHtmlHook: IndexHtmlTransformHook = (html, { path }) => {
       }
       return _match
     })
+    .replace(/<!--VITE_COMMENT_(\d+)-->/g, (_, i) => comments[i])
 
   return {
     html,