D.ts olmadan typcript'ten harici bir typcript olmayan kitaplık nasıl kullanılır?


100

Bunları .html dosyamda tanımladım:

<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>

Ardından test.js'de:

 var myTree = Tree.tree({})

Ancak Typescript hata veriyor: "'Ağaç' adı bulunamıyor"

Ayrıca test.js dosyasıyla derlemeyi --module amdve import Tree = require("model/tree");en üstüne yerleştirmeyi denedim , ancak yine hata veriyor: Cannot find external module 'model/tree'.ancak açıkça geçerli bir içe aktarma olmalı, burada tanımlandığı yere bakın: https://github.com/marmelab/tree .js / blob / master / src / main.js

Ben do not ben kullanıma istediğiniz her tek bir dış JavaScript dosyası için .d.ts dosyaları yazmak istiyorum, o typescript yapmamı istediği ciddiye mi?


1
Sen gerekmez .d.ts dosyaları yazmak. Örnek için stackoverflow.com/questions/27273489/… sayfasına bakın
xmojmr

ilginç, yine de nesneleri bildirmemi gerektiriyor. Typescript’in javascript’le tamamen uyumlu olduğu izlenimine kapıldım. Sanırım, Typescript açısından mantıklı geliyor, bir şekilde kodu okuması gerekiyor ve iyi referansları yoksa, hatalar olurdu.
Blub

Yanıtlar:


124

Kullanmak istediğim her bir harici javascript dosyası için .d.ts dosyası yazmak istemiyorum, bu ciddi anlamda Typescript'in yapmamı istediği şey mi?

Hayır. En basit / en hızlı çözüm, ona orada bazı değişkenler olduğunu söylemektir Tree. Bu kadar basit:

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

TypeSafety, TypeScript'te kayan bir ölçektir. Bu durumda, derleyiciye sadece Treeyöneteceğiniz bir şey olduğunu ve orada olduğu gerçeğinin ötesinde pek fazla tip güvenliği önemsemediğinizi söylüyorsunuz .

Daha

IMHO: Satır declare var Tree:any;, diğer JS düzenleme araçlarından çok daha basit bir sözdizimidir, kodunuzda bulunmayan değişken kullanımınızı bildirmek için yazmanızı ister.

Güncelleme

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

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

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

Bu yöntemi kullandığımda benim için şikayet ediyordu. Anton'un aşağıda belirttiği yöntemi kullanmak zorunda kaldım. Sizin milajınız değişebilir! Cevap basarat için teşekkürler.
Tiz

Daha iyi bir zeka sağlayacak herhangi bir arayüz yerine türü de belirtebilirsiniz.
Akash Kava

24

Kendiniz 'gereksinim' tanımlayabilir ve TypeScript'in belgelenmemiş amd bağımlılığı özelliğini kullanabilirsiniz:

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

'amd-bağımlılık' yönergesi derleyiciye, modülünüzü üretilen kodda argümanları "tanımlamasını" içerecek şekilde söyleyecektir: burada bir örneğe bakın .

Ayrıca kontrol edebilir çok iyi bir makale RequireJS ile typescript nasıl kullanılacağı açıklanır.

Ancak, mevcut kodunuz için uygun TypeScript tanımlarını yazmadan size herhangi bir tür bilgisi sağlanmayacağını ve bu nedenle tür güvenlik kontrolleri, araçlarda gelişmiş kod tamamlama vb. Bu nedenle, 'Ağacınız' aslında 'herhangi' türünde olacak ve aslında diğer TS kodunun içinde dinamik bir JS parçası olacaktır.


Webpack kullanırken pek iyi bir fikir değil, webpack, bu modülün aktarılırken mevcut olmasını gerektirecek ...
Akash Kava
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.