Nuxt Clarity 分析
一個輕鬆將 Clarity Analytics 整合到您的 Nuxt 3 專案的模組。
!注意 我建議您試試看 Nuxt Scripts,一個更完整的解決方案。
功能
- ✅ 適用於使用 Nitro 的 Nuxt 3 (SSR 和 SSG)
快速設定
- 將
nuxt-clarity-analytics
依賴項新增至您的專案
npx nuxi@latest module add clarity-analytics
- 將
nuxt-clarity-analytics
新增至nuxt.config.ts
的modules
區段
export default defineNuxtConfig({
modules: [
'nuxt-clarity-analytics'
]
})
接著,您必須在您的環境變數中註冊您的 Clarity ID 專案 NUXT_CLARITY_ID
。
然後 Voilà!
您可以透過在瀏覽器上檢查您的頁面,輕鬆確認腳本是否已正確注入。請注意,如果金鑰遺失,則不會注入任何內容!
您也可以使用 util clarityContent
,以便在使用者同意時使用 Cookie。它是 window.clarity
的包裝器。 請參閱 Clarity 文件。
開發
# Install dependencies
npm install
# Generate type stubs
npm run dev:prepare
# Develop with the playground
npm run dev
# Build the playground
npm run dev:build
# Run ESLint
npm run lint
# Run Vitest
npm run test
npm run test:watch
# Release new version
npm run release