CODEWITHSUNDEEP
typescriptsvelte
Scarf
Scarf

Reputation: 23

unable to use installed types with typescript in svelte

I've had a hard time being able to get my project to compile with an installed type. I'm using MediaRecorder, and I've installed @types/dom-mediacapture-record. With the default set up I was unable to get MediaRecorder recognized.

I've managed to get things working by 1) not extending @tsconfig/svelte/tsconfig.json and 2) add the specific type along with "svelte" under types: "types": ["sevlte", "@types/dom-mediacapture-record"]. I wasn't able to get this to work using typeRoots

I couldn't find examples of anyone else having this trouble online, so I feel like I must be missing something obvious.

Upvotes: 2

Views: 520

Answers (1)

Christian
Christian

Reputation: 1260

Here's what I've quickly tried and seemed to work (doesn't need any changes to tsconfig.json):

Edit

I found out there is a problem with my original code when importing some types from the current project (as opposed to some imported types from node_modules) in addition to dom-mediacapture-record. Wrapping interface Window... in declare global {...} solves this. So here goes the updated code:

// add a file "<your filename here>.d.ts" to your src directory containing 
// the following code:

// import the types from @types/dom-mediacapture-record in order
// to extend the existing Window type with them
import * as dmr from "dom-mediacapture-record";
import type { MyCustomInterface } from "./customStuff";

// Using TypeScript's declaration merging, "extend" the existing 
// Window interface
declare global {
   interface Window extends dmr, MyCustomInterface {}
}

Version Before Edit:

// add a file "<your filename here>.d.ts" to your src directory containing 
// the following code:

// import the types from @types/dom-mediacapture-record in order
// to extend the existing Window type with them
import * as dmr from "dom-mediacapture-record";

// Using TypeScript's declaration merging, "extend" the existing 
// Window interface
interface Window extends dmr {}

Upvotes: 1

Related Questions