javascript - Undertrykk Typescript-advarsler
Jeg har følgende TypeScript-kode:
private addBrowserNameAsCssClassToHtmlTag(): void {
var rootElement = angular.element(document.querySelector("html"));
if (this.isOpera()) {
rootElement.addClass("opera-browser");
} else if (this.isFirefox()) {
rootElement.addClass("firefox-browser");
} else if (this.isSafari()) {
rootElement.addClass("safari-browser");
} else if (this.isIE()) {
rootElement.addClass("ie-browser");
} else if (this.isChrome()) {
rootElement.addClass("chrome-browser");
}
}
private isOpera(): boolean {
return (!!(<any>window).opr && !!(<any>opr).addons) || !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
}
private isFirefox(): boolean {
//noinspection TypeScriptUnresolvedVariable
return typeof InstallTrigger !== 'undefined';
}
private isSafari(): boolean {
return /constructor/i.test(window.HTMLElement) || ((p): boolean => {
return p.toString() === "[object SafariRemoteNotification]";
})(!window['safari'] || safari.pushNotification);
}
private isIE(): boolean {
return /*@cc_on!@*/false || !!window.document.documentMode;
}
private isChrome(): boolean {
return !!window.chrome && !!window.chrome.webstore;
}
Koden fungerer fint, men problemet er at den genererer kompileringstidsfeil:
error TS2304: Cannot find name 'opr'.
error TS2339: Property 'opera' does not exist on type 'Window'.
error TS2304: Cannot find name 'InstallTrigger'.
error TS2339: Property 'HTMLElement' does not exist on type 'Window'.
error TS2304: Cannot find name 'safari'.
error TS2339: Property 'documentMode' does not exist on type 'Document'.
error TS2339: Property 'chrome' does not exist on type 'Window'.
error TS2339: Property 'chrome' does not exist on type 'Window'.
Hvis jeg skrev i vanlig JavaScript, ville jeg ikke hatt noe problem. Hvordan kan jeg undertrykke kompilatorvarsler angående denne delen av koden? Eller kanskje det finnes en bedre løsning som jeg ikke vet om?
Svar #1
En løsning:
declare const InstallTrigger: any;
class Abc {
private addBrowserNameAsCssClassToHtmlTag(): void {
var rootElement = angular.element(document.querySelector("html"));
if (this.isOpera()) {
rootElement.addClass("opera-browser");
} else if (this.isFirefox()) {
rootElement.addClass("firefox-browser");
} else if (this.isSafari()) {
rootElement.addClass("safari-browser");
} else if (this.isIE()) {
rootElement.addClass("ie-browser");
} else if (this.isChrome()) {
rootElement.addClass("chrome-browser");
}
}
private isOpera(): boolean {
return (!!window['opr'] && !!window['opr'].addons) || !!window['opera'] || navigator.userAgent.indexOf(' OPR/') >= 0;
}
private isFirefox(): boolean {
//noinspection TypeScriptUnresolvedVariable
return typeof InstallTrigger !== 'undefined';
}
private isSafari(): boolean {
return /constructor/i.test(window['HTMLElement']) || ((p): boolean => {
return p.toString() === "[object SafariRemoteNotification]";
})(!window['safari'] || window['safari'].pushNotification);
}
private isIE(): boolean {
return /*@cc_on!@*/false || !!window.document['documentMode'];
}
private isChrome(): boolean {
return !!window['chrome'] && !!window['chrome'].webstore;
}
}
Svar #2
Rask og enkel svar, bruk klammeparentesnotasjon, de blir ikke typekontrollert i TS
window["opera"]
Et annet alternativ er å utvide de globale grensesnittene. Når du bygger TypeScript, inkluderer kompilatoren en «base» .d.ts-fil, det kan være lib.d.ts eller hvis du bygger for ES6, lib.es6.d.ts. For å utvide de globale grensesnittene, opprett en ny .d.ts-fil, for eksempel myGlobalExtensions.d.ts, og inkluder den i byggingen din.
interface Window {
opera:string;
}
interface Document {
documentMode:string;
}
