perf(cli): remove vite-plugin-html (#11416)

packages/vant-cli/package.json

@@ -42,6 +42,7 @@
     "@jest/types": "^29.1.2",
     "@types/fs-extra": "^9.0.13",
     "@types/less": "^3.0.3",
+    "@types/lodash": "^4.14.191",
     "@types/markdown-it": "^12.2.3",
     "vue": "^3.2.45"
   },
@@ -68,9 +69,10 @@
     "husky": "^8.0.1",
     "jest": "^29.1.2",
     "jest-canvas-mock": "^2.4.0",
-    "jest-serializer-html": "^7.1.0",
     "jest-environment-jsdom": "^29.1.2",
+    "jest-serializer-html": "^7.1.0",
     "less": "^4.1.3",
+    "lodash": "^4.17.21",
     "markdown-it": "^12.3.2",
     "markdown-it-anchor": "^8.6.4",
     "nano-staged": "^0.8.0",
@@ -80,10 +82,10 @@
     "postcss-load-config": "^3.1.4",
     "prettier": "^2.7.1",
     "release-it": "^15.4.1",
+    "terser": "^5.16.1",
     "transliteration": "^2.3.5",
     "typescript": "^4.8.2",
     "vite": "^4.0.3",
-    "vite-plugin-html": "^2.1.2",
     "vite-plugin-md": "^0.11.9",
     "vue-router": "^4.1.5"
   },

packages/vant-cli/site/index.html

@@ -11,12 +11,12 @@
       name="viewport"
       content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover"
     />
-    <%- meta %>
+    <%= meta %>
     <meta http-equiv="Cache-Control" content="no-cache" />
     <meta http-equiv="Pragma" content="no-cache" />
     <meta http-equiv="Expires" content="0" />
     <% if (headHtml) { %>
-      <%- headHtml %>
+      <%= headHtml %>
     <% } %>
     <% if (baiduAnalytics) { %>
     <script>

packages/vant-cli/site/mobile.html

@@ -11,12 +11,12 @@
       name="viewport"
       content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover"
     />
-    <%- meta %>
+    <%= meta %>
     <meta http-equiv="Cache-Control" content="no-cache" />
     <meta http-equiv="Pragma" content="no-cache" />
     <meta http-equiv="Expires" content="0" />
     <% if (headHtml) { %>
-      <%- headHtml %>
+      <%= headHtml %>
     <% } %>
     <% if (enableVConsole) { %>
     <script src="https://unpkg.com/vconsole/dist/vconsole.min.js"></script>

packages/vant-cli/src/config/vite.site.ts

@@ -6,7 +6,7 @@ import vitePluginVue from '@vitejs/plugin-vue';
 import vitePluginJsx from '@vitejs/plugin-vue-jsx';
 import { setBuildTarget, getVantConfig, isDev } from '../common/index.js';
 import { SITE_DIST_DIR, SITE_SRC_DIR } from '../common/constant.js';
-import { injectHtml } from 'vite-plugin-html';
+import lodash from 'lodash';
 import type { InlineConfig, PluginOption } from 'vite';
 import type MarkdownIt from 'markdown-it';
 import { genSiteMobileShared } from '../compiler/gen-site-mobile-shared.js';
@@ -131,6 +131,18 @@ function vitePluginGenVantBaseCode(): PluginOption {
   };
 }
 
+function vitePluginHTML(data: object): PluginOption {
+  return {
+    name: 'vite-plugin-html',
+    transformIndexHtml: {
+      enforce: 'pre',
+      transform(html) {
+        return lodash.template(html)(data);
+      },
+    },
+  };
+}
+
 export function getViteConfigForSiteDev(): InlineConfig {
   setBuildTarget('site');
 
@@ -177,18 +189,16 @@ export function getViteConfigForSiteDev(): InlineConfig {
         },
       }),
       vitePluginJsx(),
-      injectHtml({
-        data: {
-          ...siteConfig,
-          title,
-          // `description` is used by the HTML ejs template,
-          // so it needs to be written explicitly here to avoid error: description is not defined
-          description: siteConfig.description,
-          headHtml,
-          baiduAnalytics,
-          enableVConsole,
-          meta: getHTMLMeta(vantConfig),
-        },
+      vitePluginHTML({
+        ...siteConfig,
+        title,
+        // `description` is used by the HTML ejs template,
+        // so it needs to be written explicitly here to avoid error: description is not defined
+        description: siteConfig.description,
+        headHtml,
+        baiduAnalytics,
+        enableVConsole,
+        meta: getHTMLMeta(vantConfig),
       }),
     ],