在TypeScript中使用第三方js文件

Question

我是typeScript的新手，我希望能夠使用沒有定義文件的第三方庫。打字稿是否允許您使用外部庫？

我想使用這個庫filesaver.js https://github.com/eligrey/FileSaver.js/

我需要創建這個庫的定義文件？

我只是需要有人指點我在正確的方向。

非常感謝！

Answer 1

打字稿是否允許您使用外部庫？

很容易。你只需要告訴打字稿。讓我們看看你的情況。

我想使用這個庫filesaver.js

簡單的只是一個功能saveAs。最簡單的聲明：

declare var saveAs:any; 

，現在下面將編譯就好：

declare var saveAs:any; 
var blob = new Blob(["Hello, world!"], {type: "text/plain;charset=utf-8"}); 
saveAs(blob, "hello world.txt"); 

寫更多的先進declrations看看：https://github.com/Microsoft/TypeScript-Handbook/blob/master/pages/declaration%20files/Introduction.md

注

更確切的但可能過度限制的樣本：

declare function saveAs(data:Blob , filename:string); 
var blob = new Blob(["Hello, world!"], {type: "text/plain;charset=utf-8"}); 
saveAs(blob, "hello world.txt"); 

Answer 2

走出務實的，但也許不是很潔淨 categoy的，不太優雅和非打字稿的方法是簡單地聲明但不分配你想打字稿使用變量/函數。這不給你Intellisense，但它確實讓你很快地使用該庫，而無需創建任何聲明或滾動自己的d.ts文件。

舉例來說，這裏是一個角例如提供OidcTokenManager作爲一個恆定的app.core模塊：

((): void => { 
    angular 
     .module('app.core') 
     .constant('OidcTokenManager', OidcTokenManager); 

})(); 

，這將產生一個TS2304 - 找不到名稱「OidcTokenManager」打字稿錯誤。

然而，通過簡單地宣佈OidcTokenManager爲任何類型，打字稿將讓你通過：

((): void => {  
    let OidcTokenManager: any; 

    angular 
     .module('app.core') 
     .constant('OidcTokenManager', OidcTokenManager); 

})(); 

Answer 3

另一種方式來調用打字稿外部庫沒有編譯錯誤是使用窗口「myglobalfunction 「符號。

例如：

jQuery call: window["$"] 
fileSaver.js : window["saveAs"](blob, "hello world.txt"); 

等等

內打字稿這些呼叫不產生編譯錯誤，但他們是全功能的方式來調用相同的標準功能。