2016-10-19 125 views
1

我正在與angular-cli(1.0.0-beta.10)的角2項目,並希望使用此庫(https://github.com/Glench/fuzzyset.js)。當我嘗試導入它時,Typescript不接受它作爲模塊,我不知道爲什麼。它給我Cannot find module錯誤。Typescript:無法找到模塊角

作爲一種變通方法我試圖將其聲明爲模塊中我system-config.ts文件

declare module "fuzzyset" {} 

我喜歡這個

import * as FuzzySet from 'fuzzyset'; 

導入它在我的組件之一,並添加到系統配置:

System.config({ 
    paths: { 
    // paths serve as alias 
    'npm:': 'vendor/' 
    }, 

    map: { 
    'fuzzyset': 'npm:fuzzyset.js/index.js', 
    }, 
    packages: cliSystemConfigPackages 
}); 

但現在它給出Cannot invoke an expression whose type lacks a call signature.

爲了解決這個錯誤,我改變了模塊聲明如下:

declare module "fuzzyset" { 
    export function FuzzySet(options?:any): any; 
} 

這並不工作的方式,一切都被編譯,但後來我得到運行時錯誤如下: Browser console errors

任何人都可以幫助我嗎? 感謝提前:)

回答

1

我能夠解決這個問題。它有一些模塊定義問題,Typescript沒有將其識別爲模塊。修改庫中的定義確實奏效,但這不是正確的方法。不修改庫的最終解決方案是在typings.d.ts中添加其定義。如果你想看到的代碼:

declare module "fuzzyset" { 
    function FuzzySet(options?: FuzzySet.FuzzySetOptions) : any; 
    namespace FuzzySet { 
     interface FuzzySetOptions { 
      arr?: any; 
      useLevenshtein?: any; 
      gramSizeLower?: any; 
      gramSizeUpper?: any; 
     } 
    } 
    export = FuzzySet; 
} 
0

只需簡單地使用:

在app.ts

import fuzzyset from 'fuzzyset' (app.ts) 

在config.ts

map: { 
    'fuzzyset': 'npm:fuzzyset.js/lib/fuzzyset.js', 
} 

類的定義,

 export class App { 

     a: any; // fuzzyset 
     printThis: array; 
     name:string; 
     constructor() { 
     // start doing fuzzy stuff 
     this.a = FuzzySet() 

     this.a.add("michael axiak"); 

     this.printThisVar = this.a.get("micael asiak"); 
     // end doing fuzzy stuff 
     this.name = 'Angular2' 
     } 
    } 

在@Component:

<p>{{printThisVar}}</p> 

工作Plnkr here

參考thisthis

+0

感謝您的答覆。你在使用Angular 2嗎?因爲它不適合我,它一直給我'找不到模塊' – Kushina

+0

是的。 Angular 2.1.0。檢查config.js。使用角/芯NPM,其最新的是2.1.0 - 參見[此](https://www.npmjs.com/package/@angular/core)。您是否嘗試刪除該聲明模塊,並僅從'fuzzyset'中導入FuzzySet。我擔心,如果你使得導入一個簡單的JavaScript導出模塊變得複雜。 – Mahesh

+0

感謝您的答案,但它不適合我。 – Kushina