nuxt初始化

nuxt-web/composables/useFancybox.ts

@@ -0,0 +1,17 @@
+import { onBeforeUnmount, onMounted } from 'vue'
+
+type FancyboxModule = typeof import('@fancyapps/ui')
+
+export function useFancybox(selector: string) {
+  let fancybox: FancyboxModule['Fancybox'] | null = null
+
+  onMounted(async () => {
+    const module = await import('@fancyapps/ui')
+    fancybox = module.Fancybox
+    fancybox.bind(selector, {})
+  })
+
+  onBeforeUnmount(() => {
+    fancybox?.destroy()
+  })
+}

nuxt-web/composables/useSeo.ts

@@ -0,0 +1,34 @@
+type SeoInput = {
+  title: string
+  description?: string
+  keywords?: string
+  ogImage?: string
+  canonicalPath?: string
+}
+
+export function useSeo(input: SeoInput) {
+  const siteUrl = 'https://example.com'
+  const fullTitle = `${input.title} - 烟台岸基网络科技有限公司`
+  const canonical = input.canonicalPath ? `${siteUrl}${input.canonicalPath}` : undefined
+
+  useSeoMeta({
+    title: fullTitle,
+    description: input.description,
+    keywords: input.keywords,
+    ogTitle: fullTitle,
+    ogDescription: input.description,
+    ogImage: input.ogImage,
+    twitterCard: input.ogImage ? 'summary_large_image' : 'summary'
+  })
+
+  if (canonical) {
+    useHead({
+      link: [
+        {
+          rel: 'canonical',
+          href: canonical
+        }
+      ]
+    })
+  }
+}