first commit

src/components/comment/Twikoo.astro

@@ -0,0 +1,88 @@
+---
+import { commentConfig } from "@/config/commentConfig";
+import { url } from "@/utils/url-utils";
+
+interface Props {
+	path: string;
+}
+
+const config = {
+	...commentConfig.twikoo,
+	el: "#tcomment",
+	path: Astro.props.path,
+};
+---
+
+<div id="tcomment"></div>
+<!-- 使用自编译的 Twikoo 文件，避免点赞等按钮导致页面触发滚动回顶部 https://github.com/twikoojs/twikoo/issues/721 -->
+<script is:inline src={url("/assets/js/firefly-twikoo-1.6.44.all.min.js")}></script>
+<script is:inline define:vars={{ config }}>
+  // 获取当前页面路径
+  function getCurrentPath() {
+    const pathname = window.location.pathname;
+    return pathname.endsWith("/") && pathname.length > 1
+      ? pathname.slice(0, -1)
+      : pathname;
+  }
+
+  // 动态创建配置对象
+  function createTwikooConfig() {
+    return {
+      ...config,
+      path: getCurrentPath(),
+      el: "#tcomment",
+    };
+  }
+
+  // 初始化 Twikoo
+  function initTwikoo() {
+    if (typeof twikoo !== "undefined") {
+      const commentEl = document.getElementById("tcomment");
+      if (commentEl) {
+        commentEl.innerHTML = "";
+
+        const dynamicConfig = createTwikooConfig();
+        console.log("[Twikoo] 初始化配置:", dynamicConfig);
+
+        twikoo
+          .init(dynamicConfig)
+          .then(() => {
+            console.log("[Twikoo] 初始化完成");
+          })
+          .catch((error) => {
+            console.error("[Twikoo] 初始化失败:", error);
+          });
+      }
+    } else {
+      // 如果 Twikoo 未加载，稍后重试
+      setTimeout(initTwikoo, 500);
+    }
+  }
+
+  // 页面加载时初始化
+  document.addEventListener("DOMContentLoaded", initTwikoo);
+
+  // Swup 页面切换后重新初始化
+  if (window.swup && window.swup.hooks) {
+    window.swup.hooks.on("content:replace", function () {
+      setTimeout(initTwikoo, 200);
+    });
+  } else {
+    document.addEventListener("swup:enable", function () {
+      if (window.swup && window.swup.hooks) {
+        window.swup.hooks.on("content:replace", function () {
+          setTimeout(initTwikoo, 200);
+        });
+      }
+    });
+  }
+
+  // 自定义事件监听
+  document.addEventListener("firefly:page:loaded", function () {
+    const commentEl = document.getElementById("tcomment");
+    if (commentEl) {
+      console.log("[Twikoo] 通过自定义事件重新初始化");
+      initTwikoo();
+    }
+  });
+</script>