diff --git a/docs/platforms/javascript/common/configuration/integrations/vue.mdx b/docs/platforms/javascript/common/configuration/integrations/vue.mdx index 1584b55a6dfb3..4aab792453ec6 100644 --- a/docs/platforms/javascript/common/configuration/integrations/vue.mdx +++ b/docs/platforms/javascript/common/configuration/integrations/vue.mdx @@ -5,8 +5,37 @@ supported: - javascript.vue --- + + + This integration is enabled by default (recommended) but can also be added manually. + + + _Import name: `Sentry.vueIntegration`_ This integration is enabled by default. If you'd like to modify your default integrations, read [this](./../#modifying-default-integrations). Adds error and span instrumentation for Vue applications. + +## Manual Setup + +If the Vue application is not defined from the start, you can add error monitoring for Vue-specific errors later on. +To manually add the integration for late-defined Vue applications: + +```javascript {filename:main.js} +import * as Sentry from '@sentry/vue'; + +Sentry.init({ + dsn: '...', + // Filter out default `Vue` integration + integrations: integrations => integrations.filter(integration => integration.name !== 'Vue'), +}); + +// Sometimes later +const app = createApp({ + template: '
hello
', +}); + +Sentry.addIntegration(Sentry.vueIntegration({ app })); +` + diff --git a/platform-includes/getting-started-config/javascript.vue.mdx b/platform-includes/getting-started-config/javascript.vue.mdx index 140665f5b0ed8..c729a4e3fb87b 100644 --- a/platform-includes/getting-started-config/javascript.vue.mdx +++ b/platform-includes/getting-started-config/javascript.vue.mdx @@ -96,3 +96,9 @@ The SDK accepts a few Vue-specific `Sentry.init` configuration options: - `attachProps` (defaults to `true`) - Includes all Vue components' props with the events. - `logErrors` (defaults to `true`) - Decides whether SDK should call Vue's original `logError` function as well. - `trackComponents` (defaults to `false`) - Track your app's components. Learn more about [component tracking](./features/component-tracking) and all its options. + + +### Late-Defined Vue Apps + +If the Vue application is not defined from the start, you can add error monitoring for Vue-specific errors later on. +To manually add the integration for late-defined Vue applications check out the docs for the Vue Integration.