SDK/FRAMEWORKS
Nuxt
Load the Vue plugin on the client only, since recording needs the browser.
plugins/edithpro.client.ts
import { EdithProPlugin } from '@edithpro/vue'; export default defineNuxtPlugin((nuxtApp) => { const config = useRuntimeConfig(); nuxtApp.vueApp.use(EdithProPlugin, { clientId: config.public.edithproClientId, workspaceId: config.public.edithproWorkspaceId, });});
nuxt.config.ts
export default defineNuxtConfig({ runtimeConfig: { public: { edithproClientId: 'ep_live_abc123', edithproWorkspaceId: 'ws_64f2a1b3', }, },});
components/RecordButton.vue
<template> <ClientOnly> <EdithProButton class="btn">Record a video</EdithProButton> </ClientOnly></template> <script setup lang="ts">import { EdithProButton } from '@edithpro/vue';</script>
The .client.ts suffix keeps the plugin out of server rendering.
Was this page helpful? @edithpro/sdk 1.0.5 · Edit this page