タイプスクリプトを使用してアウレリアにawesompleteをインポートするときのTS2307

Question

私はaurelia-cliとtypescriptを使用しています。私は私のアプリにawesompleteを統合しようとしています。だから私は実行します。npm install awesomplete --save、aurelia.json編集：

{ 
    "name": "awesomplete", 
    "path": "../node_modules/awesomplete", 
    "main": "awesomplete" 
} 

と私のTSファイルにtypings install dt~awesomplete --global --save

のTS定義をインストールし、私はimport * as awe from 'awesomplete';でそれをインポートしていますが、私はTS2307: Cannot find module 'awesomplete'を取得します。 これは初めてtsを使用しているので、私は何か間違っていると思うが、何が見つからないと思う。どのようなヒント、私はステップを逃していますか？

Answer 1

typingsでインストールするには不十分なため、コンパイラはおそらく定義ファイルを見つけられません。それはtheir FAQで述べたよう
：

{ 
    "files": [ 
     "typings/index.d.ts" 
    ] 
} 

あなたがtsconfig.jsonを使用していない場合は、追加：あなたはtsconfig.json内のファイルを使用している場合は

、インデックスファイルを追加 TypeScriptファイルの先頭への参照として：

/// <reference path="../typings/index.d.ts" /> 

あなたは上記のtypescriptですバージョン2を使用している場合は

別の（より良いオプション）は、タイピングの代わりに@typesを使用することです：あなたはのTSconfigに何も追加する必要はありませんその後

npm install @types/awesomplete --save 

もあなたが必要となりますreferenceタグを使用します。
@typesの詳細：The Future of Declaration Files

Answer 2

exportの文がtypings/globals/awesomplete/index.d.tsに表示されません。これはおそらく、タイピングの作成者がawesompleteをモジュールとしてロードする可能性を考慮せず、いくつかのグローバルを定義する単純なスクリプトとしてのみ使用することを意図していたことを意味します。だから、それから何かをインポートすることはできませんが、あなたの質問に対する答えがNitzanの解答として解読されてコンパイルにawesompleteの型を含めると、AwesompleteとAwesompleteOptionsをグローバルとして利用できるようになります。要するに、これは任意の輸入なしでコンパイル：

let awe = new Awesomplete(document.getElementById('input-id')); 

つまり、awesompleteためのタイピングがambient typingsと呼ばれていますし、他の方法で使用することができなかったものです。

Answer 3

明らかに、AwesompleteはCommonJSモジュール定義をサポートしていますが、CLIはこれを使用していません。最も簡単なのはaurelia.jsonファイルに "prepending"することだと思います。このように：

{ 
    "name": "vendor-bundle.js", 
    "prepend": [ 
    "node_modules/bluebird/js/browser/bluebird.core.js", 
    "node_modules/awesomplete/awesomplete.js" 
    ], 
    ... 
} 

それとも、あなたは常にレガシーライブラリのために働く<script>タグを使用して、それをロードすることができます。

どちらの場合でもインポートする必要はありません。Awesompleteをグローバル関数として使用する必要があります。