惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

阮一峰的网络日志
阮一峰的网络日志
博客园 - 司徒正美
D
DataBreaches.Net
宝玉的分享
宝玉的分享
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
博客园 - 【当耐特】
人人都是产品经理
人人都是产品经理
博客园 - Franky
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
IT之家
IT之家
博客园 - 三生石上(FineUI控件)
J
Java Code Geeks
腾讯CDC
博客园_首页
The Cloudflare Blog
S
SegmentFault 最新的问题
C
Check Point Blog
美团技术团队
爱范儿
爱范儿
大猫的无限游戏
大猫的无限游戏
Hugging Face - Blog
Hugging Face - Blog
T
The Blog of Author Tim Ferriss
A
About on SuperTechFans
Blog — PlanetScale
Blog — PlanetScale

Hyde Blog

Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog
Hyde Blog
Hyde · 2025-10-05 · via Hyde Blog

51.la统计 原创

简介 ​

注册 ​

版权 ​

安装 ​

pnpmnpmyarn

sh

pnpm add vitepress-plugin-51la

sh

npm add vitepress-plugin-51la

sh

yarn add vitepress-plugin-51la

使用 ​

  • docs\.vitepress\config.mts 中引入插件

    提示

    id 和 ck 为必填项,路径在 51.la 后台-配置-参数配置-统计代码-获取 SDK 追踪代码-同步安装(推荐)

    ts

    <script charset="UTF-8" id="LA_COLLECT" src="//sdk.51.la/js-sdk-pro.min.js"></script>
    <script>LA.init({id:"你的id",ck:"你的ck"})</script>

ts

import { defineConfig } from "vitepress";
import { La51Plugin } from "vitepress-plugin-51la";

export default defineConfig({
  vite: {
    // ↓↓↓↓↓
    plugins: [
      La51Plugin({
        id: "your-id",
        ck: "your-ck",
      }),
    ],
    // ↑↑↑↑↑
  },
});

构建 ​

构建后即可生效,自动向页面中注入51.la统计代码

验证 ​

自己配置 ​

提示

vite 插件配置和 head 配置任选其一即可

vite插件配置head配置

ts

vite: {
    // ↓↓↓↓↓
    plugins: [
      La51Plugin({
        id: "your-id", //动态掩码,防止 SDK 被盗刷
        ck: "your-ck", //一个网站多个统计 ID 的数据分离标识
        autoTrack: true, //开启事件分析功能,用于定义和追踪用户在产品(网站/APP等)上的各类行为,如点击、浏览、停留等。默认为false
        hashMode: true, // 开启单页面应用模式,如使用了Vue / React等框架构建的单页面应用网站,默认为true
        screenRecord: true, //开启屏幕录制功能,默认为false
        apply: "build", //'build' 构建时生效,'serve' 开发时生效,'all' 所有阶段生效
        importMode: "sync", //sync' 同步加载,'async' 异步加载,'old' 旧式安装
      }),
    ],
    // ↑↑↑↑↑
  },

ts

head: [
  // 添加 51.la 统计脚本
  [
    "script",
    {
      charset: "UTF-8",
      id: "LA_COLLECT",
      src: "//sdk.51.la/js-sdk-pro.min.js",
    },
  ],
  // 初始化统计脚本
  [
    "script",
    {},
    `
        // 等待页面加载完成后初始化
        window.addEventListener('DOMContentLoaded', () => {
          if (typeof LA !== 'undefined') {
            LA.init({
              id: 'xxxxxxxxx', // 您应用的统计掩码
              ck: 'xxxxxxxxxxxxx', // 您应用的固定key值
              autoTrack: true, //开启事件分析功能
              hashMode: true, // 开启单页面应用模式
              screenRecord: true, //开启屏幕录制功能,默认为false
            });
          }
        });
      `,
  ],
];

更多用法 ​

  • 构建开发都生效

ts

La51Plugin({
  id: "your-id",
  ck: "your-ck",
  apply: "all",
});
  • 异步引入

ts

La51Plugin({
  id: "your-id",
  ck: "your-ck",
  importMode: "async",
});
  • 完整配置

ts

export interface LA51PluginOptions {
  /**
   * 动态掩码,防止 SDK 被盗刷
   */
  id: string;
  /**
   * 一个网站多个统计 ID 的数据分离标识
   */
  ck: string;
  /**
   * 引入方式
   * @default 'sync'
   * @doc 'sync' 同步加载,'async' 异步加载,'old' 旧式安装
   */
  importMode?: "sync" | "async" | "old";
  /**
   * 生效阶段
   * @default 'build'
   * @doc 'build' 构建时生效,'serve' 开发时生效,'all' 所有阶段生效
   */
  apply?: "build" | "serve" | "all";
  /**
   * 开启事件分析功能
   * @default false
   */
  autoTrack?: boolean;
  /**
   * 使用单页面应用统计,如使用了Vue / React等框架构建的单页面应用网站
   * @default true
   */
  hashMode?: boolean;
  /**
   * 屏幕录制
   * @default false
   */
  screenRecord?: boolean;
  /**
   * 统计分析 SDK 地址
   * @default '//sdk.51.la/js-sdk-pro.min.js'
   */
  sdk?: string;
  /**
   * 事件分析 SDK Prefix
   *
   * 默认和SDK同域根目录
   * 详细说明见 https://www.yuque.com/dvqnxr/ztsh8g/ysygdp#MK9RJ
   */
  prefix?: string;
}

常见问题 ​

1.网站底部数据挂件没有显示数据?

  • docs\.vitepress\theme\components\TeekLayoutProvider.vue注册入口使用#layout-top插槽注册组件,保证 js 加载顺序
  • 请检查 idck 是否正确
  • 需在 body 标签内
  • 是否开启了域名强制匹配,可在51.la参数设置-基本信息统计域名域名强匹配检查

更多常见问题请阅读 文档