（11452期）Add Analytics – 10+ 框架一键接入 GA4

10+ 框架一键接入 GA4 一键为 React、Vue、Next.js 等主流框架集成 Google Analytics 4，自动检测项目类型、配置隐私合规与事件追踪，省去繁琐的手动接入流程。 使用说明 核心用法 add-analytics 是一款专为现代前端框架设计的 GA4 自动化集成技能。用户仅需提供 Measurement ID（G-XXXXXXXXXX 格式），技能即可智能识别项目技术栈——覆盖 Next.js（App/Pages Router）、Nuxt 3、Astro、SvelteKit、Vue/React + Vite、Angular、Gatsby 等 10 余种主流方案，并自动生成对应的最优接入代码。 显著优点 框架感知能力：通过配置文件优先级扫描（next.config.js → nuxt.config.js → astro.config.mjs 等），精准定位项目类型，避免人工判断失误。 全场景覆盖：无论是服务端渲染（SSR）、静态站点生成（SSG）还是纯 HTML 项目，均提供经过官方推荐的 Script 注入策略（如 Next.js 的 afterInteractive）。 模块化扩展：通过 --events、--consent、--debug 三大可选参数，灵活追加自定义事件追踪、GDPR/CCPA 合规的 Cookie 同意管理、以及开发调试模式。 TypeScript 原生支持：自动生成 gtag.d.ts 类型声明与框架适配的类型安全代码，消除 any 类型滥用。 潜在局限与风险 隐私合规依赖人工二次确认：虽然提供 consent 模式模板，但实际 Cookie Banner UI 与法律文案需用户自行实现，技能仅提供底层 API 封装。 环境变量管理：要求用户手动将 .env.local 加入 .gitignore，存在密钥误提交风险（技能会提示但无法强制阻止）。 广告拦截器盲区：约 25-40% 用户启用广告拦截，GA4 数据天然不完整，技能未内置服务端日志兜底方案。 Universal Analytics 遗留问题：若用户误传 UA- ID，技能仅作警告提示，需用户手动前往 GA 后台创建 GA4 属性。 适合人群 追求效率的独立开发者与初创团队，需要快速上线数据埋点 多框架技术栈并存的工程团队，需统一 GA4 接入规范 对 GDPR/CCPA 有基础合规需求但不愿从零搭建的中型项目 常规风险提醒 数据主权：Google Analytics 数据传输至美国服务器，欧盟用户需额外配置 IP 匿名化或考虑替代方案（如 Plausible） 性能敏感场景：第三方脚本可能阻塞核心指标（INP/LCP），建议在 Web Worker 中加载或使用 Partytown 等优化方案 调试陷阱：--debug 模式仅注入客户端标记，仍需配合 GA Debugger 扩展与实时报告验证，不可仅凭控制台无报错判定成功 原始说明 Add Google Analytics 4 tracking to any project. Detects framework, adds tracking code, sets up events, and configures privacy settings.