web-dev-qa-db-ja.com

Webpackを使用してd.tsおよびd.ts.mapファイルを生成する方法

Webpackを使用してd.tsおよびd.ts.mapファイルを生成する方法が見つかりません。 babel-loaderはjsおよびjs.mapファイルのみを生成します。次の図に示すように、d.tsファイルとd.ts.mapファイル（tscコマンドを使用して生成できました）も必要です。

enter image description here

以下は、すべての設定を含む最小限のリポジトリです： https://github.com/stavalfi/lerna-yarn-workspaces-example

もっと詳しく

Lerna +糸に移動しました。私のパッケージの1つは、TSおよびJSで書かれたcore（他のパッケージで使用されます）です。

私はts-to-jsにwebpack 4、babel-loader 8を使用しています。

他のパッケージは、coreパッケージのタイプ定義と実装を見つけようとしていますが、webpackでindex.jsとindex.js.mapを生成することしかできませんでした。

output: {
    path: distPath,
    filename: 'index.js',
  },
{
  "extends": "../tsconfig.settings.json",
  "compilerOptions": {
    "declaration": true,
    "declarationMap": true,
    "declarationDir": "dist",
    "rootDir": "src",
    "outDir": "dist"
  }
}
  • tsc（webpackなし）でコンパイルすると、上の図で示したようにすべてがうまく機能します。

私の戦略は間違っていますか？私は何をすべきか？

D.tsファイルを生成するプラグインをたくさん試しましたが、機能せず、d.ts.mapファイルを作成しません。

私はすでに試しました：TypeScript-declaration-webpack-plugin、npm-dts-webpack-plugin、dts-bundle-webpack、@ahrakio/witty-webpack-declaration-files。 （これらはcoreのpackage.jsonにリストされているので、複製して遊ぶことができます）。

javascripttypescriptwebpackbabel
16
Stav Alfi

ランニング ts-loader 前 babel-loaderトリックを行います。

Configで宣言ファイルが必要であることを指定するだけで十分です。

絶対パスを使用している場合、出力d.tsファイルには、役に立たない絶対パスも含まれ、TypeScriptコンパイルエラーが発生します。

それを修正するために、絶対パスを相対パスに変換するプラグインを作成しました： https://github.com/stavalfi/babel-plugin-module-resolver-loader

1
Stav Alfi

TypeScriptコンパイラtscを直接呼び出して、それを行うことができます。

使用する tsc --declarationを出力するには.d.tsファイルとtsc --declarationMapは、対応するマップファイルを生成します。

あなたはここでより多くのドキュメントを見つけることができます： https://www.typescriptlang.org/docs/handbook/compiler-options.html

4
edwin

問題は、あなたが "allowJS"を持っているのではないかということです。拡張するtsconfigでtrueです。allowJSと宣言trueが同時にオンになっていると、宣言はビルドされません。

また、タイピングに固有のローダーは必要ありません。tsconfigで宣言をtrueにして、標準のTypeScriptローダーを使用すると、Webpackではなく、tsconfigに指定された出力ディレクトリにタイピングが構築されます。

0
Shanon Jackson