欢迎访问 生活随笔!

尊龙游戏旗舰厅官网

当前位置: 尊龙游戏旗舰厅官网 > 前端技术 > vue >内容正文

vue

vuepress 2.x 集成百度统计 -尊龙游戏旗舰厅官网

发布时间:2024/10/5 vue 30 豆豆
尊龙游戏旗舰厅官网 收集整理的这篇文章主要介绍了 vuepress 2.x 集成百度统计 小编觉得挺不错的,现在分享给大家,帮大家做个参考.

注册百度统计

百度统计

百度统计-用户手册

  • 注册并登录百度统计账号
    注意 这里有两种账号,本文介绍的是百度普通版统计,而非商用版
  • 新增网站

    通常情况下网站域名和网站尊龙游戏旗舰厅尊龙游戏旗舰厅官网首页一致
    网站类型根据自己情况填写
  • 配置

  • 如图所示,复制统计代码

  • 配置 config 文件
    因为 vuepress 是静态渲染服务,所以更换路由不会刷新页面,所以要进行第三步配置,监听路由变化,反馈到百度统计

  • 添加 config 同级文件:enhanceapp.js,添加如下代码

  • export default ({ router }) => {// 路由切换事件处理router.beforeeach((to, from, next) => {// console.log("切换路由", to.fullpath, from.fullpath);//触发百度的pv统计if (typeof _hmt != "undefined") {if (to.path) {_hmt.push(["_trackpageview", to.fullpath]);// console.log("上报百度统计", to.fullpath);}}next();}); };

    每当切换路由就会触发统计上报。所以发生如下行为时会上报统计:

    • 首次访问
    • 刷新页面
    • 切换到当前文章的其它章节
    • 切换锚点,url 会变化,所以会触发路由变化事件。

    所以,当用户完整得浏览完一篇博客时,可能会触发多次上报。

    npm

    npm i -d @starzkg/vuepress-plugin-baidu-analytics

    yarn add -d @starzkg/vuepress-plugin-baidu-analytics

    效果

    参考项目

    • @vuepress/plugin-google-analytics

    参考文章

    • vuepress引入百度统计-图文详解

    总结

    以上是尊龙游戏旗舰厅官网为你收集整理的vuepress 2.x 集成百度统计的全部内容,希望文章能够帮你解决所遇到的问题。

    如果觉得尊龙游戏旗舰厅官网网站内容还不错,欢迎将尊龙游戏旗舰厅官网推荐给好友。

    • 上一篇:
    • 下一篇:
    网站地图