requirejs - Hvordan bruke et eksternt ikke-typescript bibliotek fra typescript uten .d.ts?

Jeg har definert disse i min .html-fil:

<script type="text/javascript" src="bower_components/tree.js/tree.min.js"></script>
<script type="text/javascript" src="bower_components/q/q.js"></script>
<script type="text/javascript" src="test.js"></script>

Deretter i test.js:

 var myTree = Tree.tree({})

Men Typescript gir en feil som sier: "Kan ikke finne navnet 'Tree'"

Jeg prøvde også å kompilere med --module amd og plassere import Tree=require("model/tree"); øverst i test.js-filen, men det gir feil igjen: Kan ikke finne ekstern modul 'model/tree'. Men tydeligvis burde det være en gyldig import, se her hvor den ble definert: https://github.com/marmelab/tree.js/blob/master/src/main.js

Jeg vil ikke skrive .d.ts-filer for hver eneste eksterne JavaScript-fil jeg vil bruke, er det virkelig det Typescript vil at jeg skal gjøre?

Svar #1

Jeg vil ikke skrive .d.ts-filer for hver eneste eksterne JavaScript-fil jeg vil bruke, er det virkelig det TypeScript vil at jeg skal gjøre?

Nei. Den enkleste/raskeste løsningen er rett og slett å si til det at det finnes en variabel Tree der ute. Dette er så enkelt som:

declare var Tree:any; // Magic
var myTree = Tree.tree({})

TypeSafety er en glidende skala i TypeScript. I dette tilfellet forteller du bare kompilatoren at det finnes noe som heter Tree som du vil håndtere, og du bryr deg ikke mye om typesikkerhet utover det faktum at det finnes.

Mer

Etter min mening: Linjen declare var Tree:any; er mye enklere syntaks enn andre JS-verktøy for verifisering ville få deg til å skrive for å erklære bruken av variabler som ikke er til stede i koden din.

Oppdater

interface ITree {
    .. further methods and properties...
}

interface ITreeFactory {
    tree(input: { [key: string]: any }): Itree
};

declare var Tree: ITreeFactory; // magic...

Svar #2

Du kan definere 'require' selv og bruke udokumentert amd-avhengighetsfunksjon i TypeScript:

/// <amd-dependency path="model/tree" />
declare var require:(moduleId:string) => any;
var Tree = require("model/tree");

Direktivet ''amd-dependency'' vil fortelle kompilatoren å inkludere modulen din i "define"-argumentene i generert kode: se et eksempel her.

Du kan også sjekke en veldig god artikkel som forklarer hvordan du bruker TypeScript med RequireJS.

Men merk at uten å skrive riktige TypeScript-definisjoner for din eksisterende kode, vil du ikke få noen typeinformasjon, og derfor vil du ikke få typekontroller, avansert kodefullføring i verktøy og så videre. Så din 'Tree' vil faktisk være av typen 'any', og vil faktisk være et dynamisk JS-stykke inni annen TS-kode.

Relaterte artikler