diff --git a/packages/vite/src/node/plugins/html.ts b/packages/vite/src/node/plugins/html.ts
index 0de37b8c04d5db..9737dcb3a9e9b7 100644
--- a/packages/vite/src/node/plugins/html.ts
+++ b/packages/vite/src/node/plugins/html.ts
@@ -286,7 +286,7 @@ export function buildHtmlPlugin(config: ResolvedConfig): Plugin {
     config.plugins,
   )
   preHooks.unshift(preImportMapHook(config))
-  normalHooks.unshift(htmlEnvHook(config))
+  preHooks.push(htmlEnvHook(config))
   postHooks.push(postImportMapHook())
   const processedHtml = new Map<string, string>()
   const isExcludedUrl = (url: string) =>
diff --git a/playground/html/.env b/playground/html/.env
index 61dfca27f1b4a4..a94d8ee1e130c5 100644
--- a/playground/html/.env
+++ b/playground/html/.env
@@ -1 +1,2 @@
 VITE_FOO=bar
+VITE_FAVICON_URL=/sprite.svg
diff --git a/playground/html/__tests__/html.spec.ts b/playground/html/__tests__/html.spec.ts
index afb8185621af69..39294f5510aa17 100644
--- a/playground/html/__tests__/html.spec.ts
+++ b/playground/html/__tests__/html.spec.ts
@@ -273,6 +273,11 @@ describe('env', () => {
     expect(await page.textContent('.env-bar')).toBeTruthy()
     expect(await page.textContent('.env-prod')).toBe(isBuild + '')
     expect(await page.textContent('.env-dev')).toBe(isServe + '')
+
+    const iconLink = await page.$('link[rel=icon]')
+    expect(await iconLink.getAttribute('href')).toBe(
+      `${isBuild ? './' : '/'}sprite.svg`,
+    )
   })
 })
 
diff --git a/playground/html/env.html b/playground/html/env.html
index a20c569096ee91..056377071c19fb 100644
--- a/playground/html/env.html
+++ b/playground/html/env.html
@@ -3,3 +3,4 @@
 <p class="env-%VITE_FOO%">class name should be env-bar</p>
 <p class="env-prod">%PROD%</p>
 <p class="env-dev">%DEV%</p>
+<link rel="icon" href="%VITE_FAVICON_URL%" />