VuePress 生态系统VuePress 生态系统
  • 主题指南
  • 默认主题
  • Hope 主题
  • Plume 主题
  • Reco 主题
  • 功能插件
  • Markdown 插件
  • 搜索插件
  • 博客插件
  • 渐进式应用插件
  • 统计分析插件
  • 搜索引擎优化插件
  • 开发插件
  • 工具插件
  • AI 插件
  • @vuepress/helper
  • English
  • 简体中文
GitHub
  • 主题指南
  • 默认主题
  • Hope 主题
  • Plume 主题
  • Reco 主题
  • 功能插件
  • Markdown 插件
  • 搜索插件
  • 博客插件
  • 渐进式应用插件
  • 统计分析插件
  • 搜索引擎优化插件
  • 开发插件
  • 工具插件
  • AI 插件
  • @vuepress/helper
  • English
  • 简体中文
GitHub
  • baidu-analytics
  • google-analytics
  • umami-analytics

google-analytics

@vuepress/plugin-google-analytics

将 Google Analytics 集成到 VuePress 中。

该插件会通过引入 gtag.js 来启用 Google Analytics 4 。

使用方法

npm i -D @vuepress/plugin-google-analytics@next
.vuepress/config.ts
import { googleAnalyticsPlugin } from '@vuepress/plugin-google-analytics'

export default {
  plugins: [
    googleAnalyticsPlugin({
      // 配置项
    }),
  ],
}

上报事件

Google Analytics 会 自动收集部分事件 ,比如 page_view, first_visit 等。

因此,如果你只是想收集站点的一些基础数据,你只需要正确设置 Measurement ID ,不需要再额外做其他事情。

在引入该插件之后,一个全局的 gtag() 函数会被挂载到 window 对象上,你可以使用它进行 自定义事件的上报 。

选项

id

  • 类型: string

  • 详情:

    Google Analytics 4 的 Measurement ID ,应以 'G-' 开头。

    你可以通过 这里 的指引来找到你的 Measurement ID 。注意区分 Google Analytics 4 的 Measurement ID (即 "G-" 开头的 ID) 和 Universal Analytics 的 Tracking ID (即 "UA-" 开头的 ID)。

  • 示例:

.vuepress/config.ts
export default {
  plugins: [
    googleAnalyticsPlugin({
      id: 'G-XXXXXXXXXX',
    }),
  ],
}

debug

  • 类型: boolean

  • 详情:

    设置为 true 可以向 DebugView 发送事件。了解更多关于 DebugView 的信息 。

  • 示例:

.vuepress/config.ts
export default {
  plugins: [
    googleAnalyticsPlugin({
      id: 'G-XXXXXXXXXX',
      debug: true,
    }),
  ],
}
在 GitHub 上编辑此页
上次更新: 2025/4/12 19:03
贡献者: Mister-Hope
上一页
baidu-analytics
下一页
umami-analytics