feat(vite-plugins): 添加 vant-touch-emulator 和 eruda 脚本支持

2025-11-03 01:13:49 +08:00
parent f790691d5a
commit bd9acc06a8
3 changed files with 130 additions and 77 deletions
--- a/index.html
+++ b/index.html
@@ -11,40 +11,6 @@
      name="viewport"
      content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"
    />
-    <script>
-      window.addEventListener('DOMContentLoaded', function () {
-        window.ontouchstart = function () {};
-        window.ontouchend = function () {};
-      });
-
-      window.onloadX = function () {
-        // 禁止双指缩放
-        document.addEventListener('touchstart', function (event) {
-          if (event.touches.length > 1) {
-            event.preventDefault();
-          }
-        });
-
-        // 禁止双击放大
-        var lastTouchEnd = 0;
-        document.addEventListener(
-          'touchend',
-          function (event) {
-            var now = new Date().getTime();
-            if (now - lastTouchEnd <= 300) {
-              event.preventDefault();
-            }
-            lastTouchEnd = now;
-          },
-          false,
-        );
-
-        // 禁止手势事件
-        document.addEventListener('gesturestart', function (event) {
-          event.preventDefault();
-        });
-      };
-    </script>

    <meta name="color-scheme" content="light dark" />
    <meta name="format-detection" content="telephone=no" />
@@ -132,35 +98,69 @@
    <!-- <script src="https://testingcf.jsdelivr.net/npm/@vant/touch-emulator/dist/index.min.js"></script> -->
    <!-- .min.js 是 jsDelivr 的特殊处理 -->
    <!-- <script src="https://unpkg.luckincdn.com/@vant/touch-emulator@1.4.0/dist/index.js"></script> -->
-  </body>
-  <script>
-    (function (d) {
-      var config = {
-          kitId: 'whk2tto',
-          scriptTimeout: 3000,
-          async: true,
-        },
-        h = d.documentElement,
-        t = setTimeout(function () {
-          h.className = h.className.replace(/\bwf-loading\b/g, '') + ' wf-inactive';
-        }, config.scriptTimeout),
-        tk = d.createElement('script'),
-        f = false,
-        s = d.getElementsByTagName('script')[0],
-        a;
-      h.className += ' wf-loading';
-      tk.src = 'https://use.typekit.net/' + config.kitId + '.js';
-      tk.async = true;
-      tk.onload = tk.onreadystatechange = function () {
-        a = this.readyState;
-        if (f || (a && a != 'complete' && a != 'loaded')) return;
-        f = true;
-        clearTimeout(t);
-        try {
-          Typekit.load(config);
-        } catch (e) {}
+    <script>
+      window.addEventListener('DOMContentLoaded', function () {
+        window.ontouchstart = function () {};
+        window.ontouchend = function () {};
+      });
+
+      window.onloadX = function () {
+        // 禁止双指缩放
+        document.addEventListener('touchstart', function (event) {
+          if (event.touches.length > 1) {
+            event.preventDefault();
+          }
+        });
+
+        // 禁止双击放大
+        var lastTouchEnd = 0;
+        document.addEventListener(
+          'touchend',
+          function (event) {
+            var now = new Date().getTime();
+            if (now - lastTouchEnd <= 300) {
+              event.preventDefault();
+            }
+            lastTouchEnd = now;
+          },
+          false,
+        );
+
+        // 禁止手势事件
+        document.addEventListener('gesturestart', function (event) {
+          event.preventDefault();
+        });
      };
-      s.parentNode.insertBefore(tk, s);
-    }); /* (document) */
-  </script>
+    </script>
+    <script>
+      (function (d) {
+        var config = {
+            kitId: 'whk2tto',
+            scriptTimeout: 3000,
+            async: true,
+          },
+          h = d.documentElement,
+          t = setTimeout(function () {
+            h.className = h.className.replace(/\bwf-loading\b/g, '') + ' wf-inactive';
+          }, config.scriptTimeout),
+          tk = d.createElement('script'),
+          f = false,
+          s = d.getElementsByTagName('script')[0],
+          a;
+        h.className += ' wf-loading';
+        tk.src = 'https://use.typekit.net/' + config.kitId + '.js';
+        tk.async = true;
+        tk.onload = tk.onreadystatechange = function () {
+          a = this.readyState;
+          if (f || (a && a != 'complete' && a != 'loaded')) return;
+          f = true;
+          clearTimeout(t);
+          try {
+            Typekit.load(config);
+          } catch (e) {}
+        };
+        s.parentNode.insertBefore(tk, s);
+      }); /* (document) */
+    </script>
+  </body>
 </html>
--- a/src/plugins/00.app-config.ts
+++ b/src/plugins/00.app-config.ts
@@ -10,17 +10,4 @@ export function install({ app }: { app: import('vue').App<Element> }) {
    // 2. 显示全局错误提示
    // 3. 进行错误分析和处理
  };
-
-  // if (import.meta.env.MODE === 'development' && '1' === ('2' as never)) {
-  //   // TODO: https://github.com/hu3dao/vite-plugin-debug/
-  //   // https://eruda.liriliri.io/zh/docs/#快速上手
-  //   import('eruda').then(({ default: eruda }) => {
-  //     eruda.init({
-  //       defaults: {
-  //         transparency: 0.9,
-  //       },
-  //     })
-  //     /* eruda.show(); */
-  //   })
-  // }
 }
--- a/vite-plugins/09.index-html-plugin.ts
+++ b/vite-plugins/09.index-html-plugin.ts
@@ -26,7 +26,73 @@ function IndexHtmlPlugin(): PluginOption {
  };
 }

+function ___(): PluginOption {
+  // https://github.com/hu3dao/vite-plugin-debug/blob/2935025e8ce082b9a5aef04766bcae3e996b3e55/src/index.ts
+  return {
+    name: 'vant-touch-emulator-online',
+    apply: 'build',
+    transformIndexHtml(html) {
+      return {
+        html,
+        tags: [
+          {
+            tag: 'script',
+            attrs: {
+              src: 'https://testingcf.jsdelivr.net/npm/@vant/touch-emulator/dist/index.min.js',
+              // 这里的 `.min.js` 是 jsDelivr 的特殊处理
+              // src: 'https://unpkg.luckincdn.com/@vant/touch-emulator@1.4.0/dist/index.js',
+            },
+            injectTo: 'body',
+          },
+
+          // >>>>> eruda
+
+          {
+            tag: 'script',
+            attrs: {
+              src: 'https://testingcf.jsdelivr.net/npm/eruda/eruda.js',
+            },
+            injectTo: 'body',
+          },
+          {
+            tag: 'script',
+            children: `eruda.init();`,
+            injectTo: 'body',
+          },
+          // https://eruda.liriliri.io/zh/docs/#快速上手
+          //   import('eruda').then(({ default: eruda }) => {
+          //     eruda.init({
+          //       defaults: {
+          //         transparency: 0.9,
+          //       },
+          //     })
+          //     /* eruda.show(); */
+          //   })
+          // }
+          // <<<<<
+
+          // >>>>> vConsole
+          {
+            tag: 'script',
+            attrs: {
+              src: 'https://cdn.jsdelivr.net/npm/vconsole@latest/dist/vconsole.min.js',
+            },
+            injectTo: 'body',
+          },
+          {
+            tag: 'script',
+            children: `new window.VConsole();`,
+            injectTo: 'body',
+          },
+          // <<<<<
+        ],
+      };
+    },
+  };
+}
+
 export function loadPlugin(_configEnv: ConfigEnv): PluginOption {
+  // return [___()];
  const env = loadEnv(_configEnv.mode, process.cwd());
  if (env.VITE_BUILD_MINIFY === 'true') return IndexHtmlPlugin();
 }