Having difficulty configuring the TypeScript definition for the Azure Media Player in an Angular 10 project. Using the *.d.ts file obtained from the official documentation
Attempted setting up the definition using typeRoots in the tsconfig.json file:
"typeRoots": [ "./src/types/", "./node_modules/@types"],
Encountered conflicting information on where to place the types folder, either at the root level or inside the src folder. Currently, the azuremediaplayer.d.ts file is located in ./src/types/azuremediaplayer/.
Error message in tsconfig file states
Cannot find type definition file for 'azuremediaplayer'.In my component, copied code snippet from official documentation, excluding functions (causing errors).
ngOnInit(): void {
var myPlayer = amp('vid1', {
"nativeControlsForTouch": false,
autoplay: false,
controls: true,
width: "640",
height: "400",
poster: ""
});
myPlayer.src([{
src: "http://amssamples.streaming.mediaservices.windows.net/91492735-c523-432b-ba01-faba6c2206a2/AzureMediaServicesPromo.ism/manifest",
type: "application/vnd.ms-sstr+xml"
}])
}
When clicking on amp function above, redirects to .d.ts file, yet certain parameters cause errors:
Argument of type '{ nativeControlsForTouch: boolean; autoplay: false; controls: true; width: string; height: string; poster: string; }' is not assignable to parameter of type 'Options'.
Object literal may only specify known properties, and '"nativeControlsForTouch"' does not exist in type 'Options'.
No errors occur when initialization is as follows:
var myPlayer = amp('vid1', {
autoplay: false,
controls: true,
poster: ""
});
myPlayer.src([{
src: "http://amssamples.streaming.mediaservices.windows.net/91492735-c523-432b-ba01-faba6c2206a2/AzureMediaServicesPromo.ism/manifest",
type: "application/vnd.ms-sstr+xml"
}])
}
The player functions if instantiated in the HTML file.
Followed steps described in this answer: If reference file with
/// <reference path="../../../types/azuremediaplayer/azuremediaplayer.d.ts" />files: [] property causes amp() to be unrecognized. Including "include": ["src/**/*"]What is the correct setup to ensure proper functionality of the player?