setup posthog

website/.env-example

@@ -0,0 +1 @@
+VITE_POSTHOG_TOKEN=your_posthog_token

website/docs/.vitepress/config.ts

@@ -107,6 +107,9 @@ const config: UserConfig = {
     ],
   ],
   vite: {
+    // the root path is website/docs/, so this will make
+    // vite look for the env file in website/
+    envDir: "../",
     define: {
       "process.env": {},
     },

website/docs/.vitepress/theme/index.ts

@@ -2,4 +2,25 @@
 import DefaultTheme from "vitepress/theme";
 
 import "./vars.css";
-export default DefaultTheme;
+import type { Theme } from "vitepress";
+import posthog from "posthog-js";
+
+const theme: Theme = {
+  extends: DefaultTheme,
+  enhanceApp({ router }) {
+    if (import.meta.env.SSR) return;
+    const token = import.meta.env.VITE_POSTHOG_TOKEN;
+    if (!token) return;
+
+    posthog.init(token, {
+      api_host: "https://app.posthog.com",
+      autocapture: false,
+    });
+
+    router.onAfterRouteChanged = () => {
+      posthog.capture("$pageview");
+    };
+  },
+};
+
+export default theme;

website/vite-env.d.ts

@@ -10,3 +10,7 @@ declare module "*!raw" {
   const lib: [string, string][];
   export default lib;
 }
+
+interface ImportMetaEnv {
+  VITE_POSTHOG_TOKEN?: string;
+}