既存の JavaScript ライブラリから .d.ts 「タイピング」定義ファイルを生成するにはどうすればよいでしょうか?
-
12-12-2019 - |
質問
私は自分自身とサードパーティの両方のライブラリを多数使用しています。「typings」ディレクトリには、Jquery と WinRT 用のものが含まれているようです...しかし、それらはどのように作成されるのでしょうか?
解決
対象のライブラリ、その記述方法、および求めている精度のレベルに応じて、いくつかのオプションが利用可能です。おおよその望ましい順にオプションを確認してみましょう。
もしかしたらすでに存在しているかもしれません
常に DefinitelyTyped をチェックしてください (https://github.com/DefinitelyTyped/DefinitelyTyped) 初め。これは文字通り何千もの .d.ts ファイルで満たされたコミュニティ リポジトリであり、あなたが使用しているものはすでにそこにある可能性が非常に高いです。TypeSearch (https://microsoft.github.io/TypeSearch/) これは、NPM で公開された .d.ts ファイルの検索エンジンです。これには、DefinitelyTyped よりもわずかに多くの定義が含まれます。いくつかのモジュールは、NPM ディストリビューションの一部として独自の定義も提供しているため、独自の定義を作成する前に、該当するかどうかも確認してください。
もしかしたら必要ないかもしれません
TypeScript がサポートするようになりました。 --allowJs
フラグを設定すると、.js ファイルでさらに JS ベースの推論が行われます。.js ファイルをコンパイルに含めてみることができます。 --allowJs
を設定して、十分な型情報が得られるかどうかを確認してください。TypeScript は、これらのファイル内の ES5 スタイルのクラスや JSDoc コメントなどを認識しますが、ライブラリが奇妙な方法でそれ自体を初期化すると、問題が発生する可能性があります。
始めましょう --allowJs
もし --allowJs
まともな結果が得られ、より良い定義ファイルを自分で書きたい場合は、以下を組み合わせることができます。 --allowJs
と --declaration
TypeScript のライブラリの型に関する「最良の推測」を確認します。これは適切な出発点となり、JSDoc コメントが適切に記述されており、コンパイラーがコメントを見つけることができた場合は、手動で作成したファイルと同じくらい優れたものになる可能性があります。
dts-gen を使ってみる
もし --allowJs
うまくいきませんでした。dts-gen (https://github.com/Microsoft/dts-gen) 開始点を取得します。このツールは、オブジェクトの実行時の形状を使用して、利用可能なすべてのプロパティを正確に列挙します。プラスの面として、これは非常に正確である傾向がありますが、このツールは追加の型を設定するための JSDoc コメントのスクレイピングをまだサポートしていません。これを次のように実行します。
npm install -g dts-gen
dts-gen -m <your-module>
これにより生成されます your-module.d.ts
現在のフォルダー内。
スヌーズボタンを押す
すべてを後で実行し、しばらく型を使用せずにやりたい場合は、TypeScript 2.0 では次のように書くことができます。
declare module "foo";
それはあなたに import
の "foo"
タイプ付きモジュール any
. 。後で処理したいグローバルがある場合は、次のように記述します
declare const foo: any;
それはあなたに与えるでしょう foo
変数。
他のヒント
Ryanのようなtsc --declaration fileName.ts
を使用することも、Projectの下にdeclaration: true
を持っていると仮定してcompilerOptions
inのtsconfig.json
の下にtsconfig.json
を指定することもできます。
これに対処するための最良の方法(宣言ファイルが DefutlyTyped )の場合ライブラリ全体ではなく使用するものだけの宣言を書く。これにより、作業が多いほど、さらにコンパイラが不足している方法を訴えることによって手助けをするためのものです。
Ryanが言うように、TSCコンパイラは、--declaration
ファイルから.d.ts
ファイルを生成するスイッチ.ts
を持っています。また、(バグのバグ)TypesScriptはJavaScriptをコンパイルできるようにすることになっているため、既存のJavaScriptコードをTSCコンパイラに渡すことができます。
現代のJavaScriptを持つ複数の*.js
ファイルを含む単一のタイプの定義ファイルを作成するいくつかのPowerShellです。
まず、すべての拡張子を.ts
に変更します。
Get-ChildItem | foreach { Rename-Item $_ $_.Name.Replace(".js", ".ts") }
.
secondは、TypeScriptコンパイラを使用して定義ファイルを生成します。コンパイラエラーの束がありますが、それらを無視することができます。
Get-ChildItem | foreach { tsc $_.Name }
.
最後に、すべての*.d.ts
ファイルを1つのindex.d.ts
にまとめて、import
ステートメントを削除し、各Exportステートメントからdefault
を削除します。
Remove-Item index.d.ts;
Get-ChildItem -Path *.d.ts -Exclude "Index.d.ts" | `
foreach { Get-Content $_ } | `
where { !$_.ToString().StartsWith("import") } | `
foreach { $_.Replace("export default", "export") } | `
foreach { Add-Content index.d.ts $_ }
.
これは、多くの定義を含む単一の使用可能なindex.d.ts
ファイルで終わります。
スクリプト#またはSharpKitをサポートするサポートされている3rd Party JSライブラリの既存のマッピングを探します。これらのC#から.jsクロスコンパイラのユーザーは、あなたが今直面している問題に直面しており、あなたのサードパーティのlibをスキャンしてスケルトンC#クラスに変換するためのオープンソースプログラムを公開しました。もしそうなら、C#。の代わりにScannerプログラムをハックしてTypesScriptを生成する
それを失敗させると、3rd Party LibのC#パブリックインタフェースをTypesScript定義に変換すると、Source JavaScriptを読むことで同じことをするよりも簡単かもしれません。
私の特別興味はSenchaのextjs Riaフレームワークです、そして、私はスクリプト#またはsharpkit のためのc#の解釈を生成するために公開されたプロジェクトがあることを知っています
独自のライブラリを作成する場合、次のように作成できます。 *.d.ts
ファイルを使用して、 tsc
(TypeScript コンパイラ) コマンドは次のようになります。(ライブラリを構築していると仮定すると、 dist/lib
フォルダ)
tsc -d --declarationDir dist/lib --declarationMap --emitDeclarationOnly
-d
(--declaration
):を生成します*.d.ts
ファイル--declarationDir dist/lib
:生成された宣言ファイルの出力ディレクトリ。--declarationMap
:対応する「.d.ts」ファイルごとにソースマップを生成します。--emitDeclarationOnly
:「.d.ts」宣言ファイルのみを出力します。(コンパイルされた JS はありません)
(を参照してください。 ドキュメント すべてのコマンド ライン コンパイラ オプション)
または、たとえばあなたの package.json
:
"scripts": {
"build:types": "tsc -d --declarationDir dist/lib --declarationMap --emitDeclarationOnly",
}
そして次を実行します: yarn build:types
(または npm run build:types
)