@flecblog/core-nuxt 0.1.0

package/composables/useUser.ts

@@ -0,0 +1,202 @@
+import type {
+  UserInfo,
+  LoginParams,
+  RegisterParams,
+  ForgotPasswordParams,
+  ResetPasswordParams,
+  ChangePasswordParams,
+  DeactivateAccountParams,
+  UpdateProfileParams,
+  LoginResponse,
+  RegisterResponse,
+} from '@@/types/user';
+import {
+  getUserProfile,
+  updateUserProfile as updateProfileApi,
+  login as loginApi,
+  register as registerApi,
+  forgotPassword as forgotPasswordApi,
+  resetPassword as resetPasswordApi,
+  changePassword as changePasswordApi,
+  setPassword as setPasswordApi,
+  deactivateAccount as deactivateAccountApi,
+  unbindOAuth as unbindOAuthApi,
+  pollWechatLoginStatus as pollWechatApi,
+} from '@/composables/api/user';
+
+const userInfo = ref<UserInfo | null>(null);
+
+const showLoginModal = ref(false);
+
+export function useLoginModal() {
+  const open = () => {
+    showLoginModal.value = true;
+  };
+
+  const close = () => {
+    showLoginModal.value = false;
+  };
+
+  return {
+    showLoginModal,
+    open,
+    close,
+  };
+}
+
+// 邮箱绑定提示相关状态
+const GLOBAL_REMIND_INTERVAL = 12 * 60 * 60 * 1000;
+const COMMENT_REMIND_INTERVAL = 10 * 60 * 1000;
+const SKIP_TIME_KEY = 'bindEmailSkipTime';
+const showBindEmailModal = ref(false);
+type TriggerType = 'global' | 'comment';
+
+export function useBindEmail() {
+  const shouldShowPrompt = async (
+    trigger: TriggerType,
+    userInfo?: UserInfo | null
+  ): Promise<boolean> => {
+    if (!isLoggedIn.value) return false;
+    let user = userInfo;
+    if (!user) {
+      try {
+        user = await getUserProfile();
+      } catch {
+        return false;
+      }
+    }
+    if (!user?.is_virtual_email) return false;
+    const skipTime = localStorage.getItem(SKIP_TIME_KEY);
+    if (skipTime) {
+      const elapsed = Date.now() - parseInt(skipTime, 10);
+      const interval = trigger === 'comment' ? COMMENT_REMIND_INTERVAL : GLOBAL_REMIND_INTERVAL;
+      if (elapsed < interval) return false;
+    }
+    return true;
+  };
+
+  const triggerGlobal = async (userInfo?: UserInfo | null) => {
+    if (await shouldShowPrompt('global', userInfo)) {
+      showBindEmailModal.value = true;
+    }
+  };
+
+  const triggerOnComment = async () => {
+    if (await shouldShowPrompt('comment')) {
+      showBindEmailModal.value = true;
+    }
+  };
+
+  const onBindSuccess = () => {
+    localStorage.removeItem(SKIP_TIME_KEY);
+  };
+
+  const onSkip = () => {
+    localStorage.setItem(SKIP_TIME_KEY, String(Date.now()));
+  };
+
+  return { showBindEmailModal, triggerGlobal, triggerOnComment, onBindSuccess, onSkip };
+}
+
+export function useUser() {
+  const isLoggedIn = useAuth();
+  const loading = ref(false);
+  const error = ref<Error | null>(null);
+
+  const fetchUserInfo = async () => {
+    if (!isLoggedIn.value) {
+      userInfo.value = null;
+      return null;
+    }
+    loading.value = true;
+    error.value = null;
+    try {
+      const data = await getUserProfile();
+      userInfo.value = data;
+      return data;
+    } catch (e) {
+      console.error('获取用户信息失败:', e);
+      error.value = e instanceof Error ? e : new Error(String(e));
+      userInfo.value = null;
+      return null;
+    } finally {
+      loading.value = false;
+    }
+  };
+
+  const clearUserInfo = () => {
+    userInfo.value = null;
+  };
+
+  async function login(params: LoginParams): Promise<LoginResponse> {
+    return loginApi(params);
+  }
+
+  async function register(params: RegisterParams): Promise<RegisterResponse> {
+    return registerApi(params);
+  }
+
+  async function forgotPassword(params: ForgotPasswordParams): Promise<void> {
+    return forgotPasswordApi(params);
+  }
+
+  async function resetPassword(params: ResetPasswordParams): Promise<void> {
+    return resetPasswordApi(params);
+  }
+
+  async function changePassword(params: ChangePasswordParams): Promise<void> {
+    return changePasswordApi(params);
+  }
+
+  async function setPassword(params: {
+    password: string;
+    confirm_password: string;
+  }): Promise<void> {
+    return setPasswordApi(params);
+  }
+
+  async function updateUserProfile(params: UpdateProfileParams): Promise<UserInfo> {
+    const data = await updateProfileApi(params);
+    userInfo.value = data;
+    return data;
+  }
+
+  async function deactivateAccount(params: DeactivateAccountParams): Promise<void> {
+    return deactivateAccountApi(params);
+  }
+
+  async function unbindOAuth(provider: string): Promise<void> {
+    return unbindOAuthApi(provider);
+  }
+
+  function setToken(token: string): void {
+    setAccessToken(token);
+  }
+
+  async function pollWechatLoginStatus(scene: string) {
+    return pollWechatApi(scene);
+  }
+
+  return {
+    userInfo,
+    userAvatar: computed(() => getAvatarUrl(userInfo.value || {})),
+    userNickname: computed(() => userInfo.value?.nickname || '用户'),
+    userEmail: computed(() => userInfo.value?.email || ''),
+    loading,
+    error,
+    fetchUserInfo,
+    clearUserInfo,
+    login,
+    register,
+    forgotPassword,
+    resetPassword,
+    changePassword,
+    setPassword,
+    updateUserProfile,
+    deactivateAccount,
+    unbindOAuth,
+    setToken,
+    pollWechatLoginStatus,
+    getUserProfile: fetchUserInfo,
+  };
+}

package/layouts/default.vue

@@ -0,0 +1 @@
+<template><div><slot /></div></template>

package/nuxt.config.ts

@@ -0,0 +1,170 @@
+import { dirname, resolve } from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const layerRoot = resolve(__dirname);
+
+export default defineNuxtConfig({
+  compatibilityDate: '2025-07-15',
+  ssr: true,
+  features: { inlineStyles: true },
+
+  alias: {
+    '@@': layerRoot,
+    '@': layerRoot,
+  },
+
+  typescript: {
+    tsConfig: {
+      compilerOptions: {
+        paths: {
+          '@@': [layerRoot],
+          '@@/*': [resolve(layerRoot, './*')],
+          '@': [layerRoot],
+          '@/*': [resolve(layerRoot, './*')],
+        },
+      },
+    },
+  },
+
+  app: {
+    head: {
+      htmlAttrs: { lang: 'zh-CN' },
+      script: [
+        {
+          innerHTML: `
+            (function() {
+              var theme = localStorage.getItem('theme');
+              var isDark = theme === 'dark' || (!theme && window.matchMedia('(prefers-color-scheme: dark)').matches);
+              document.documentElement.setAttribute('data-theme', isDark ? 'dark' : 'light');
+            })();
+          `,
+          type: 'text/javascript',
+          tagPosition: 'head',
+        },
+      ],
+    },
+  },
+
+  modules: [
+    '@vueuse/nuxt',
+    '@nuxt/image',
+    '@nuxtjs/seo',
+    '@vite-pwa/nuxt',
+    [
+      '@nuxtjs/critters',
+      {
+        config: {
+          preload: 'swap',
+          inlineFonts: false,
+          pruneSource: false,
+        },
+      },
+    ],
+  ],
+
+  css: ['@/assets/css/base.scss', 'remixicon/fonts/remixicon.css'],
+
+  site: {
+    url: '',
+    defaultLocale: 'zh-CN',
+  },
+  sitemap: {
+    strictNuxtContentPaths: true,
+  },
+  robots: {
+    allow: '/',
+  },
+  ogImage: {
+    enabled: false,
+  },
+
+  runtimeConfig: {
+    public: {
+      apiUrl: '',
+      activeTheme: '',
+      appVersion: process.env.FLECBLOG_VERSION || '1.0.0',
+    },
+  },
+
+  pwa: {
+    registerType: 'autoUpdate',
+    manifest: false,
+    workbox: {
+      navigateFallback: '/',
+      globPatterns: ['**/*.{js,css,html,png,ico,webp,woff,woff2}'],
+      globIgnores: ['**/remixicon*.svg'],
+      maximumFileSizeToCacheInBytes: 3 * 1024 * 1024,
+      runtimeCaching: [
+        {
+          urlPattern: /\.(?:png|jpg|jpeg|svg|gif|webp|ico)$/i,
+          handler: 'CacheFirst',
+          options: {
+            cacheName: 'images',
+            expiration: {
+              maxEntries: 100,
+              maxAgeSeconds: 60 * 60 * 24 * 30,
+            },
+          },
+        },
+      ],
+    },
+    client: {
+      installPrompt: true,
+      periodicSyncForUpdates: 3600,
+    },
+    devOptions: {
+      enabled: false,
+      type: 'module',
+    },
+  },
+
+  vite: {
+    build: {
+      rollupOptions: {
+        output: {
+          manualChunks(id) {
+            if (id.includes('node_modules/vue/') || id.includes('node_modules/@vue/')) {
+              return 'vue-core';
+            }
+            if (id.includes('node_modules/vue-router')) {
+              return 'vue-router';
+            }
+            if (id.includes('node_modules/dayjs')) {
+              return 'dayjs';
+            }
+            if (
+              id.includes('node_modules/markdown-it') ||
+              id.includes('node_modules/dompurify') ||
+              id.includes('node_modules/isomorphic-dompurify')
+            ) {
+              return 'markdown-renderer';
+            }
+            if (id.includes('node_modules/katex')) {
+              return 'katex';
+            }
+            if (id.includes('node_modules/highlight.js')) {
+              return 'highlight';
+            }
+            if (id.includes('node_modules/@vueuse')) {
+              return 'vueuse';
+            }
+            if (id.includes('node_modules/aplayer')) {
+              return 'aplayer';
+            }
+          },
+        },
+      },
+      chunkSizeWarningLimit: 600,
+      cssCodeSplit: true,
+      sourcemap: false,
+      cssMinify: true,
+    },
+  },
+
+  router: {
+    options: {
+      scrollBehaviorType: 'smooth',
+    },
+  },
+});

package/package.json

@@ -0,0 +1,58 @@
+{
+  "name": "@flecblog/core-nuxt",
+  "version": "0.1.0",
+  "description": "FlecBlog Nuxt Layer（共享核心）",
+  "type": "module",
+  "main": "./nuxt.config.ts",
+  "files": [
+    "nuxt.config.ts",
+    "app.vue",
+    "composables",
+    "plugins",
+    "components",
+    "layouts",
+    "pages",
+    "server",
+    "assets",
+    "utils",
+    "types"
+  ],
+  "dependencies": {
+    "@nuxt/image": "^2.0.0",
+    "@nuxtjs/critters": "^0.9.0",
+    "@nuxtjs/seo": "^5.1.3",
+    "@traptitech/markdown-it-katex": "^3.6.0",
+    "@vite-pwa/nuxt": "^1.1.1",
+    "@vueuse/core": "^14.2.1",
+    "@vueuse/nuxt": "^14.2.1",
+    "dayjs": "^1.11.19",
+    "dompurify": "^3.3.1",
+    "highlight.js": "^11.11.1",
+    "isomorphic-dompurify": "^3.0.0",
+    "katex": "^0.16.45",
+    "markdown-it": "^14.1.1",
+    "markdown-it-anchor": "^9.2.0",
+    "markdown-it-kbd": "^3.0.2",
+    "markdown-it-link-attributes": "^4.0.1",
+    "markdown-it-mark": "^4.0.0",
+    "markdown-it-plugin-underline": "^0.0.1",
+    "markdown-it-sub": "^2.0.0",
+    "markdown-it-sup": "^2.0.0",
+    "markdown-it-task-lists": "^2.1.1",
+    "mermaid": "^11.12.3",
+    "remixicon": "^4.9.1"
+  },
+  "devDependencies": {
+    "@types/node": "^25.3.2",
+    "@types/markdown-it": "^14.1.2",
+    "sass": "^1.97.3",
+    "typescript": "^5.9.3"
+  },
+  "peerDependencies": {
+    "nuxt": "^4.3.0",
+    "vue": "^3.5.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}

package/pages/index.vue

@@ -0,0 +1 @@
+<template><div>FlecBlog：请在主题中覆盖 pages/index.vue</div></template>

package/plugins/console-banner.client.ts

@@ -0,0 +1,11 @@
+export default defineNuxtPlugin(() => {
+  const config = useRuntimeConfig();
+  const version = config.public.appVersion;
+
+  console.log(
+    `%c FlecBlog %c v${version} %c github.com/talen8/FlecBlog `,
+    'background: #49b1f5; color: #fff; padding: 4px 6px; border-radius: 4px 0 0 4px; font-weight: bold;',
+    'background: #3a8fd4; color: #fff; padding: 4px 6px;',
+    'background: #2d7ab8; color: #fff; padding: 4px 6px; border-radius: 0 4px 4px 0;'
+  );
+});

package/plugins/custom-code.ts

@@ -0,0 +1,121 @@
+interface TagData {
+  tag: string;
+  innerHTML?: string;
+  [key: string]: string | undefined;
+}
+
+interface HeadPayload {
+  meta: Record<string, string>[];
+  link: Record<string, string>[];
+  script: (Record<string, string> & { innerHTML?: string })[];
+  style: (Record<string, string> & { innerHTML?: string })[];
+}
+
+export default defineNuxtPlugin({
+  name: 'custom-code',
+  setup() {
+    const { basicConfig } = useSysConfig();
+
+    const parseHtmlTags = (html: string): TagData[] => {
+      if (!html) return [];
+
+      const tags: TagData[] = [];
+      const tagRegex = /<(\w+)([^>]*)>([\s\S]*?)<\/\1>|<(\w+)([^>]*)\s*\/>/gi;
+      let match;
+
+      while ((match = tagRegex.exec(html)) !== null) {
+        const tagName = match[1] || match[4];
+        if (!tagName) continue;
+
+        const attrsStr = match[2] || match[5];
+        const innerHTML = match[3];
+
+        const tagData: TagData = { tag: tagName.toLowerCase() };
+
+        if (attrsStr) {
+          const attrRegex = /(\S+)=["']([^"']*)["']/g;
+          let attrMatch: RegExpExecArray | null;
+          while ((attrMatch = attrRegex.exec(attrsStr)) !== null) {
+            tagData[attrMatch[1]!] = attrMatch[2];
+          }
+        }
+
+        if (innerHTML) {
+          tagData.innerHTML = innerHTML;
+        }
+
+        tags.push(tagData);
+      }
+
+      return tags;
+    };
+
+    const buildHeadPayload = (headCode: string): HeadPayload | null => {
+      if (!headCode) return null;
+
+      const tags = parseHtmlTags(headCode);
+      const headPayload: HeadPayload = {
+        meta: [],
+        link: [],
+        script: [],
+        style: [],
+      };
+
+      tags.forEach(tag => {
+        const { tag: tagName, innerHTML, ...attrs } = tag;
+
+        const filteredAttrs = Object.fromEntries(
+          Object.entries(attrs).filter(([, v]) => v !== undefined)
+        ) as Record<string, string>;
+
+        switch (tagName) {
+          case 'meta':
+            headPayload.meta.push(filteredAttrs);
+            break;
+          case 'link':
+            headPayload.link.push(filteredAttrs);
+            break;
+          case 'script':
+            headPayload.script.push(innerHTML ? { ...filteredAttrs, innerHTML } : filteredAttrs);
+            break;
+          case 'style':
+            headPayload.style.push(innerHTML ? { ...filteredAttrs, innerHTML } : filteredAttrs);
+            break;
+        }
+      });
+
+      return headPayload;
+    };
+
+    useHead(
+      computed(() => {
+        const customHead = buildHeadPayload(String(basicConfig.value.custom_head || ''));
+
+        return {
+          meta: customHead?.meta || [],
+          link: customHead?.link || [],
+          script: customHead?.script || [],
+          style: customHead?.style || [],
+        };
+      })
+    );
+
+    const injectBodyCode = () => {
+      const bodyCode = String(basicConfig.value.custom_body || '');
+
+      if (bodyCode && import.meta.client) {
+        const oldContainer = document.getElementById('custom-body-inject');
+        if (oldContainer) {
+          oldContainer.remove();
+        }
+
+        const container = document.createElement('div');
+        container.id = 'custom-body-inject';
+        container.innerHTML = bodyCode;
+        document.body.prepend(container);
+      }
+    };
+
+    watch(basicConfig, injectBodyCode, { immediate: true });
+  },
+});

package/plugins/syncThemeMeta.ts

@@ -0,0 +1,28 @@
+import themeConfig from '~/theme.config.json';
+import configSchema from '~/schemas/config.json';
+import migrations from '~/schemas/migrations.json';
+
+export default defineNuxtPlugin(async () => {
+  const apiUrl = useRuntimeConfig().public.apiUrl as string;
+  if (!apiUrl) return;
+
+  try {
+    await $fetch(`${apiUrl}/themes/_sync`, {
+      method: 'POST',
+      body: {
+        slug: themeConfig.slug,
+        name: themeConfig.name,
+        version: themeConfig.version,
+        author: themeConfig.author,
+        description: themeConfig.description,
+        cover: themeConfig.cover,
+        license: themeConfig.license,
+        repo: themeConfig.repo,
+        schema: configSchema,
+        migrations,
+      },
+    });
+  } catch (e) {
+    console.warn('[core-nuxt] 主题元数据上报失败:', e);
+  }
+});

package/plugins/tracker.client.ts

@@ -0,0 +1,107 @@
+/**
+ * 访问统计追踪插件
+ * 自动追踪 PV/UV、页面停留时长、支持手动事件追踪
+ *
+ * 使用 .client.ts 后缀确保只在客户端运行
+ * 使用 requestIdleCallback 延迟初始化，避免阻塞首屏渲染
+ */
+
+// 类型声明
+export interface TrackerPlugin {
+  trackPageView: (path?: string, articleId?: number) => void;
+  trackEvent: (name: string, data?: Record<string, unknown>) => void;
+  setArticleId: (id?: number) => void;
+}
+
+declare module '#app' {
+  interface NuxtApp {
+    $tracker: TrackerPlugin;
+  }
+}
+
+export default defineNuxtPlugin({
+  parallel: true,
+  setup() {
+    const router = useRouter();
+    const endpoint = `${useRuntimeConfig().public.apiUrl}/collect`;
+    const { userInfo } = useUser();
+
+    let pageStartTime = Date.now();
+    let lastPageUrl = location.pathname + location.search;
+    let currentArticleId: number | undefined;
+
+    // 检查是否为超级管理员
+    const isSuperAdmin = () => {
+      // 从响应式状态读取
+      return userInfo.value?.role === 'super_admin';
+    };
+
+    const getBaseData = (url?: string, articleId?: number) => ({
+      url: url || location.pathname + location.search,
+      hostname: location.hostname,
+      referrer: document.referrer,
+      language: navigator.language,
+      screen: `${screen.width}x${screen.height}`,
+      title: document.title,
+      timestamp: Date.now(),
+      ...(articleId !== undefined && { article_id: articleId }),
+    });
+
+    const send = (
+      type: string,
+      extra: Record<string, unknown> = {},
+      url?: string,
+      articleId?: number
+    ) => {
+      if (isSuperAdmin()) return;
+
+      const payload = { ...getBaseData(url, articleId), type, ...extra };
+      const blob = new Blob([JSON.stringify(payload)], { type: 'application/json' });
+      if (navigator.sendBeacon) {
+        navigator.sendBeacon(endpoint, blob);
+      } else {
+        fetch(endpoint, { method: 'POST', body: blob, keepalive: true }).catch(() => {});
+      }
+    };
+
+    const sendDuration = (url?: string, articleId?: number) => {
+      const sec = Math.floor((Date.now() - pageStartTime) / 1000);
+      if (sec > 0) send('duration', { duration: sec }, url, articleId);
+    };
+
+    // 页面隐藏/卸载时发送停留时长
+    document.addEventListener('visibilitychange', () => {
+      if (document.hidden) {
+        sendDuration(undefined, currentArticleId);
+      } else {
+        pageStartTime = Date.now();
+      }
+    });
+    window.addEventListener('beforeunload', () => sendDuration(undefined, currentArticleId));
+
+    // 路由变化时统计
+    router.afterEach(to => {
+      setTimeout(() => {
+        sendDuration(lastPageUrl, currentArticleId);
+        pageStartTime = Date.now();
+        lastPageUrl = to.path;
+        currentArticleId = undefined;
+        send('pageview', {}, to.path);
+      }, 100);
+    });
+
+    return {
+      provide: {
+        tracker: {
+          trackPageView: (path?: string, articleId?: number) =>
+            send('pageview', {}, path, articleId),
+          trackEvent: (name: string, data?: Record<string, unknown>) =>
+            name && send('event', { event_name: name, event_data: data }),
+          setArticleId: (id?: number) => {
+            currentArticleId = id;
+          },
+        },
+      },
+    };
+  },
+});