2016-03-19 16 views
4

Angular2 ve Typescript'te çok yeniyim. Ben incelikle js harici kütüphanesini kullanmak için bir yol bulmak istiyorum:SystemJS Yapılandırması için Harici JavaScript Kitaplığı Dışa Aktarım Bildirimi

declare var somelibrary: any; 
somelibrary.doAnithing(); 

Ama bazı typization sahip olmak istiyorum, bu yüzden * .d.ts kullanımı için here okuyun: Biliyorum, ben kullanabilirsiniz

export declare class Chart { 
    constructor (ctx: any); 

    Doughnut(data: any, options: any): Function; 
} 

(Ben de denemek :)

export declare module 'chart' { 
    export class Chart { 
     constructor (ctx: any); 

     Doughnut(data: any, options: any): Function; 
    } 
} 
:

Yani ben bir modül chart.d.ts oluşturmak

ve ona başvuru, çalışırken birçok yolları:

// version 1 
import chartFactory = require('../chart'); 
// version2 
import { Chart } from '../chart'; 

ve kullanmak:

// version 2 usage 
new Chart(ctx).Doughnut(this.chart1, {responsive : true}); 

derleme başarandır ama tarih:

// version 1 usage  
new chartFactory.Chart(ctx).Doughnut(this.chart1, {responsive : true}); 

veya ikinci ithalatı

runtime SystemJS js implementati yüklemeye çalışın tanımımda 'path/to/chart.js' arandığında (herhangi bir chart.js yok, orijinal kütüphane komut dosyasıyla içe aktarılıyor). explaination ile

System.config({ 
    packages: { 
     app: { 
      format: 'register', 
      defaultExtension: 'js' 
     } 
    } 
}); 

tsconfig.json

{ 
    "compilerOptions": { 
    "target": "es5", 
    "module": "system", 
    "moduleResolution": "node", 
    "sourceMap": true, 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "removeComments": false, 
    "noImplicitAny": false 
    }, 
    "exclude": [ 
    "node_modules", 
    "typings/main", 
    "typings/main.d.ts" 
    ] 
} 

bazı öneriler:

SystemJS yapılandırma açısal öğretici aynıdır?

Hatalı kilitlenmenin nedeninin "module": "system" olduğunu düşünüyorum, ancak soru şudur: SystemJS çözünürlüğüyle çakışmadan dahili d.ts nasıl yapılır?

cevap

1

Aradığınızı düşünüyorum ortam modülleri Bu kitap hakkında daha fazla bilgiyi here el kitabında bulabilirsiniz.

Sen (chart.d.ts olarak) böyle bir tane bildirebilirsiniz:

declare module "chart" { 
    export class Chart { 
     constructor (ctx: any); 
     Doughnut(data: any, options: any): Function; 
    } 
} 

Ve bu gibi kullanmak mümkün olmalıdır:

import {Chart} from "chart"; 

let c = new Chart(1); 

Not: Bu, Grafik işlevinin genel bağlamda kullanılabileceğini varsayar.

Her şey için kendi .d.ts dosyalarınızı bildirmeniz gerekmez, ayrıca size yardımcı olabilecek araçlar da vardır. typings veya tsd gibi.

+0

Cevabınız için teşekkürler, bunu denedim, ve gönderdiğiniz link ise ben aynı gönderiyorum. Sorun şu ki, SystemJS yok bir chart.js için arama ve uygulama kırdı ... – Guaido79

+0

Bize chart.js kütüphanesine işaret edebilirdi. :) – toskv

+0

@ Guaido79 bu mu? http://www.chartjs.org/ – toskv

0

Grafik.js'nin dışa aktarma değerini bir değer konumunda, örn. sadece kendi türü için değil, bu yüzden TypeScript, modülünüzü aktardığı zaman bir bağımlılık olarak yayar. Sorun şudur: chart.js, yükleyici için mevcut değildir. SystemJS yapılandırmanızda, harita veya paketlerde, , örn. 'path': 'path/to/chart.js' ve kod etiketini kaldırın. Eğer bazı nedenlerden dolayı bir komut dosyası etiketi kullanmanız gerekiyorsa

, ayrıca bir CDN ya da her neyse yoluyla chart.js yüklemek için SystemJS yapılandırabilirsiniz

export interface Chart { 
    new (ctx: any); 
    Doughnut(data: any, options: any): Function; 
} 

Not senin tür bildirimi dosyasını değiştirin.

Şahsen ben, komut dosyası etiketinden sakınmak ve uygun bir modül olarak yüklemek istiyorum. Bunu faydalı bulabilirsin: http://www.chartjs.org/docs/#getting-started-installation

İlgili konular