diff --git a/playground/index.html b/playground/index.html
index ac36907aeb7a3e..2756476e249f6c 100644
--- a/playground/index.html
+++ b/playground/index.html
@@ -1,3 +1,12 @@
-<link rel="icon" href="/public/icon.png" />
-<div id="app"></div>
-<script type="module" src="./main.js"></script>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>Vite App</title>
+  <link rel="icon" href="/public/icon.png" />
+</head>
+<body>
+  <div id="app"></div>
+  <script type="module" src="./main.js"></script>
+</body>
+</html>
diff --git a/src/node/build/buildPluginHtml.ts b/src/node/build/buildPluginHtml.ts
index 7af4e5109ab937..08a251837083dc 100644
--- a/src/node/build/buildPluginHtml.ts
+++ b/src/node/build/buildPluginHtml.ts
@@ -114,6 +114,8 @@ const compileHtml = async (
   inlineLimit: number,
   resolver: InternalResolver
 ) => {
+  // @vue/compiler-core doesn't like lowercase doctypes
+  html = html.replace(/<!doctype\s/i, '<!DOCTYPE ')
   const ast = parse(html)
 
   let js = ''
