mixpanel/mixpanel-js

Cannot read properties of undefined (reading 'persistence')

Opened this issue · 0 comments

500 Internal server error
Cannot read properties of undefined (reading 'persistence')

at MixpanelLib.register (http://localhost:3000/_nuxt/node_modules/.cache/vite/client/deps/mixpanel-browser.js?v=a2700112:3558:13)
at http://localhost:3000/_nuxt/plugins/mixpanel.ts:9:3
at http://localhost:3000/_nuxt/@id/virtual:nuxt:/Users/lucky/develop/trial/nuxt-app-pnpm/.nuxt/plugins/client.mjs:35:69
at executeAsync (http://localhost:3000/_nuxt/node_modules/.pnpm/unctx@2.3.1/node_modules/unctx/dist/index.mjs?v=a2700112:111:19)
at setup (http://localhost:3000/_nuxt/@id/virtual:nuxt:/Users/lucky/develop/trial/nuxt-app-pnpm/.nuxt/plugins/client.mjs:35:43)
at http://localhost:3000/_nuxt/node_modules/.pnpm/nuxt@3.9.1_eslint@8.56.0_rollup@2.79.1_typescript@5.3.3_vite@5.0.11/node_modules/nuxt/dist/app/nuxt.js?v=a2700112:111:60
at fn (http://localhost:3000/_nuxt/node_modules/.pnpm/nuxt@3.9.1_eslint@8.56.0_rollup@2.79.1_typescript@5.3.3_vite@5.0.11/node_modules/nuxt/dist/app/nuxt.js?v=a2700112:181:44)
at Object.runWithContext (http://localhost:3000/_nuxt/node_modules/.cache/vite/client/deps/chunk-H6H6JTMU.js?v=a2700112:5394:18)
at callWithNuxt (http://localhost:3000/_nuxt/node_modules/.pnpm/nuxt@3.9.1_eslint@8.56.0_rollup@2.79.1_typescript@5.3.3_vite@5.0.11/node_modules/nuxt/dist/app/nuxt.js?v=a2700112:186:24)
at http://localhost:3000/_nuxt/node_modules/.pnpm/nuxt@3.9.1_eslint@8.56.0_rollup@2.79.1_typescript@5.3.3_vite@5.0.11/node_modules/nuxt/dist/app/nuxt.js?v=a2700112:32:54

My instalation step:

  1. Install the following dependencies:
# Mixpanel
pnpm add mixpanel-browser

# Types
pnpm add -D @types/mixpanel-browser

  1. Create plugins/mixpanel.ts file and initialize it:
import { init, register } from "mixpanel-browser";

export default defineNuxtPlugin(() => {
  const { mixpanelToken, appVersion } = useRuntimeConfig().public;

  init(mixpanelToken as string, {
    debug: process.env.NODE_ENV !== "production",
    ignore_dnt: process.env.NODE_ENV !== "production",
  });

  register({
    "App Version": appVersion,
  });
});

3.Import the plugin in nuxt.config.ts:

export default defineNuxtConfig({
  // ..
  plugins: [
	'~/plugins/mixpanel.ts',
  ],
})

4.Pass environment variables in nuxt.config.ts:

export default defineNuxtConfig({
  // ..
  runtimeConfig: {
    public: {
	appVersion: "0.0.1",
	mixpanelToken: process.env.MIXPANEL_TOKEN,
    }
  }
})