fix: 构建时报错 ReferenceError: document is not defined

Justin3go · Oct 21, 2024 · ea043ed · ea043ed
1 parent 0b11875
commit ea043ed
Show file tree

Hide file tree

Showing 4 changed files with 22 additions and 18 deletions.
diff --git a/docs/.vitepress/theme/components/ImageViewer.vue b/docs/.vitepress/theme/components/ImageViewer.vue
@@ -16,18 +16,18 @@
 <script setup lang="ts">
 import { onMounted, onUnmounted, reactive, ref, watch } from "vue";
 import { useRoute } from "vitepress";
-import enConfig from 'tdesign-vue-next/es/locale/en_US';
-import zhConfig from 'tdesign-vue-next/es/locale/zh_CN';
+import enConfig from "tdesign-vue-next/es/locale/en_US";
+import zhConfig from "tdesign-vue-next/es/locale/zh_CN";
 
 import TDesignDark from "./TDesignDark.vue";
 
 // 处理 TDesign 的国际化
 const route = useRoute();
-const globalConfig = ref< typeof zhConfig | typeof enConfig>(zhConfig);
+const globalConfig = ref<typeof zhConfig | typeof enConfig>(zhConfig);
 watch(
 	() => route.path,
 	() => {
-    globalConfig.value = route.path.startsWith("/en") ? enConfig : zhConfig;
+		globalConfig.value = route.path.startsWith("/en") ? enConfig : zhConfig;
 	},
 	{
 		immediate: true,
@@ -67,13 +67,19 @@ function previewImage(e: Event) {
 	}
 }
 onMounted(() => {
-	const docDomContainer = document.querySelector("#VPContent");
-	docDomContainer?.addEventListener("click", previewImage);
+	if (typeof document !== "undefined") {
+		// 使用document的代码
+		const docDomContainer = document.querySelector("#VPContent");
+		docDomContainer?.addEventListener("click", previewImage);
+	}
 });
 
 onUnmounted(() => {
-	const docDomContainer = document.querySelector("#VPContent");
-	docDomContainer?.removeEventListener("click", previewImage);
+	if (typeof document !== "undefined") {
+		// 使用document的代码
+		const docDomContainer = document.querySelector("#VPContent");
+		docDomContainer?.removeEventListener("click", previewImage);
+	}
 });
 </script>
 <style>

diff --git a/docs/.vitepress/theme/components/TDesignDark.vue b/docs/.vitepress/theme/components/TDesignDark.vue
@@ -9,15 +9,17 @@ const { isDark } = useData();
 watch(
 	isDark,
 	() => {
-    if(isDark.value) {
-      document.documentElement.setAttribute('theme-mode', 'dark');
-    } else {
-      document.documentElement.removeAttribute('theme-mode');
-    }
+		if (typeof document !== "undefined") {
+			// 使用document的代码
+			if (isDark.value) {
+				document.documentElement.setAttribute("theme-mode", "dark");
+			} else {
+				document.documentElement.removeAttribute("theme-mode");
+			}
+		}
 	},
 	{
 		immediate: true,
 	}
 );
-
 </script>
diff --git a/docs/archive.md b/docs/archive.md
@@ -52,8 +52,6 @@ const postGroups = computed(() => {
   });
   return groups;
 });
-
-console.log('postGroups', postGroups.value);
 </script>
 <style lang="scss" scoped>
 

diff --git a/docs/en/archive.md b/docs/en/archive.md
@@ -52,8 +52,6 @@ const postGroups = computed(() => {
   });
   return groups;
 });
-
-console.log('postGroups', postGroups.value);
 </script>
 <style lang="scss" scoped>