diff --git a/src/platforms/javascript/guides/vue/configuration/integrations/vue-router.mdx b/src/platforms/javascript/guides/vue/configuration/integrations/vue-router.mdx index 1599e8b8ec06f..6cb77f2deb877 100644 --- a/src/platforms/javascript/guides/vue/configuration/integrations/vue-router.mdx +++ b/src/platforms/javascript/guides/vue/configuration/integrations/vue-router.mdx @@ -5,21 +5,24 @@ redirect_from: - /sdks/react/integrations/vue-router/ --- -If you are using Vue Router, you should use our provided integration to get better, parameterized transaction names. Here is a full example of how to use it: +If you're using Vue Router, you should use our provided routing instrumentation to get better, parameterized transaction names. -```javascript +Our routing instrumentation supports `vue-router` v2, v3, and v4. + +Here is a full example of how to use it: + +```javascript {filename:main.js} import Vue from "vue"; import App from "./App"; import * as Sentry from "@sentry/vue"; import { BrowserTracing } from "@sentry/tracing"; import Router from "vue-router"; import HelloWorld from "@/components/HelloWorld"; +import Foo from "@/components/Foo"; +import Bar from "@/components/Bar"; Vue.use(Router); -const Foo = { template: "