fix: warn for unresolved css in html

packages/playground/html/index.html

@@ -5,3 +5,6 @@ <h1>Hello</h1>
 <!-- comment two -->
 <script type="module"></script>
 <script type="module" src="/main.js"></script>
+<link rel="icon" href="{{cdn_host}}/cdn/images/favicon.ico" />
+<link rel="stylesheet" href="{{cdn_host}}/css.css" type="text/css" />
+<script src="{{cdn_host}}/js.js"></script>

packages/vite/src/node/plugins/html.ts

@@ -246,6 +246,7 @@ export function buildHtmlPlugin(config: ResolvedConfig): Plugin {
         const s = new MagicString(html)
         const assetUrls: AttributeNode[] = []
         const scriptUrls: ScriptAssetsUrl[] = []
+        const styleUrls: string[] = []
         let inlineModuleIndex = -1
 
         let everyScriptIsAsync = true
@@ -338,7 +339,7 @@ export function buildHtmlPlugin(config: ResolvedConfig): Plugin {
                 if (!isExcludedUrl(url)) {
                   if (node.tag === 'link' && isCSSRequest(url)) {
                     // CSS references, convert to import
-                    js += `\nimport ${JSON.stringify(url)}`
+                    styleUrls.push(url)
                     shouldRemove = true
                   } else {
                     assetUrls.push(p)
@@ -469,6 +470,19 @@ export function buildHtmlPlugin(config: ResolvedConfig): Plugin {
           }
         }
 
+        await Promise.all(
+          styleUrls.map(async (styleUrl) => {
+            const resolvedUrl = await this.resolve(styleUrl, id)
+            if (resolvedUrl == null) {
+              config.logger.warnOnce(
+                `\n${styleUrl} doesn't exist at build time, it will remain unchanged to be resolved at runtime`
+              )
+            } else {
+              js += `\nimport ${JSON.stringify(styleUrl)}`
+            }
+          })
+        )
+
         processedHtml.set(id, s.toString())
 
         // inject module preload polyfill only when configured and needed