Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Type 'BrowserTracing' is not assignable to type 'Integration' :: Vue 3 w/ Capactor 3

See original GitHub issue

Environment

"@capacitor/core": "^3.5.1",
"@sentry/capacitor": "^0.10.0",
"@sentry/vue": "^7.13.0,
"vue": "^3.1.5"

import * as Sentry from "@sentry/capacitor";
import * as SentryVue from "@sentry/vue";
import { BrowserTracing } from "@sentry/tracing";

Sentry.init({
        app,
        dsn: "***",
        integrations: [
            new BrowserTracing({
                routingInstrumentation: SentryVue.vueRouterInstrumentation(router),
                tracingOrigins: ["localhost", "***", "***", /^\//],
            }),
        ],
        environment: process.env.VUE_APP_SH_ENV,
        tracesSampleRate: 1.0,
    }, SentryVue.init);

Steps to Reproduce

Use above package versions & set up in main.ts for a Vue3 project
Attempt to build project

Expected Result

The project would build successfully.

Actual Result

See #197 for my original comment. I took NilsFrkl’s advice and removed the direct reference to @sentry/tracing which still produces the error:

TS2322: Type 'BrowserTracing' is not assignable to type 'Integration'.   
Types of property 'setupOnce' are incompatible.     
Type '(_: (callback: EventProcessor) => void, getCurrentHub: () => Hub) => void' is not assignable to type '(addGlobalEventProcessor: (callback: EventProcessor) => void, getCurrentHub: () => Hub) => void'.       
Types of parameters '_' and 'addGlobalEventProcessor' are incompatible.         
Types of parameters 'callback' and 'callback' are incompatible.          
Type 'import("/Users/vanpyrzericj/Development/abcd/app-web/node_modules/@sentry/types/types/eventprocessor").EventProcessor' is not assignable to type 'import("/Users/vanpyrzericj/Development/abcd/app-web/node_modules/@sentry/vue/node_modules/@sentry/types/types/eventprocessor").EventProcessor'.             
Types of parameters 'event' and 'event' are incompatible.               
Type 'import("/Users/vanpyrzericj/Development/abcd/app-web/node_modules/@sentry/vue/node_modules/@sentry/types/types/event").Event' is not assignable to type 'import("/Users/vanpyrzericj/Development/abcd/app-web/node_modules/@sentry/types/types/event").Event'.                 
Types of property 'spans' are incompatible.                   
Type 'import("/Users/vanpyrzericj/Development/abcd/app-web/node_modules/@sentry/vue/node_modules/@sentry/types/types/span").Span[] | undefined' is not assignable to type 'import("/Users/vanpyrzericj/Development/abcd/app-web/node_modules/@sentry/types/types/span").Span[] | undefined'.                    
 Type 'import("/Users/vanpyrzericj/Development/abcd/app-web/node_modules/@sentry/vue/node_modules/@sentry/types/types/span").Span[]' is not assignable to type 'import("/Users/vanpyrzericj/Development/abcd/app-web/node_modules/@sentry/types/types/span").Span[]'.                       
Type 'import("/Users/vanpyrzericj/Development/abcd/app-web/node_modules/@sentry/vue/node_modules/@sentry/types/types/span").Span' is not assignable to type 'import("/Users/vanpyrzericj/Development/abcd/app-web/node_modules/@sentry/types/types/span").Span'.                         
Types of property 'transaction' are incompatible.                           
Type 'import("/Users/vanpyrzericj/Development/abcd/app-web/node_modules/@sentry/vue/node_modules/@sentry/types/types/transaction").Transaction | undefined' is not assignable to type 'import("/Users/vanpyrzericj/Development/abcd/app-web/node_modules/@sentry/types/types/transaction").Transaction | undefined'.                            
Property 'getBaggage' is missing in type 'import("/Users/vanpyrzericj/Development/abcd/app-web/node_modules/@sentry/vue/node_modules/@sentry/types/types/transaction").Transaction' but required in type 'import("/Users/vanpyrzericj/Development/abcd/app-web/node_modules/@sentry/types/types/transaction").Transaction'.

Issue Analytics

State:
Created a year ago
Comments:9

Top GitHub Comments

3reactions

bbughcommented, Dec 12, 2022

This is blocking us from using Replays as an integration, will an update be released to support 7.25.0 soon?

0reactions

lucas-zimermancommented, Dec 13, 2022

Soon, but even so, replay isn’t currently working with Capacitor (with the updated SDK), I opened a different issue to see what’s going on with Replay https://github.com/getsentry/sentry-capacitor/issues/279

Top Results From Across the Web

Ionic 6 Capacitor 3 - import { BrowserTracing } from '@sentry ...

Steps to Reproduce. import { BrowserTracing } from '@sentry/tracing'; on Ionic Capacitor fails with error. [ng] Error: node_modules/@sentry/ ...

Vue 3 Typescript not assignable to type '[]' - Stack Overflow

In TypeScript, the type [] explicitly mean empty array/tuple. type A = []; const a: A = ['a']; // Error -> Type '[string]'...

Vue - Sentry Documentation

On this page, we get you up and running with Sentry's SDK, so that it will automatically report errors and exceptions in your...

URL Query Parameters with JavaScript, Vue 2 and Vue 3

Learn to read and write URL Query Parameters in JavaScript and VueJS to make dynamic, deep links within your application.

Not assignable errors with Vue 3, Typescript, Composition API

I've built some components using Vue 3, TypeScript, and the Composition API, ... is not assignable to parameter of type 'VNodeTypes | ClassComponent'....