コマンドラインを使用したTypescriptソースマップBabel

Question

コマンドラインから実行するとき、Babelにソースマップを生成させようとしています。ソースマップの周りのBabel docsは、グループのワークフローのほうをターゲットとしているようで、コマンドラインにどのように変換されるのか分かりません。

私は

tsc -p ./src 

マイtsconfig.jsonを使用して、私のtypescriptですをコンパイルしています：

{ 
    "compilerOptions": { 
     "module": "amd", 
     "noImplicitAny": true, 
     "removeComments": false, 
     "preserveConstEnums": true, 
     "out": "wwwroot/app.js", 
     "sourceMap": true, 
     "target": "ES6" 
    }, 
    "files": [ 
     "App.ts" 
    ] 
} 

これはwwwrootに/ app.jsとwwwrootに/ app.js.mapを生成します。

私はその後、app.js上バベル実行します。これはapp.jsを変更し、もはやラインアップ2を意味しない、元の状態にapp.js.map葉

babel ./wwwroot/app.js -o ./wwwroot/app.js --presets es2015 --compact false --inputSourceMap ./wwwroot/app.js.map --sourceMaps both 

。

最終的なapp.jsをタイプコピーソースにマップする新しいソースマップを作成するにはどうすればよいですか？

Answer 1

私はまったく同じことを探していると、この発見された：https://phabricator.babeljs.io/T6911

は、基本的には、高度なオプションがbabel --name=valueでも使用することができながら、inputSourceMapのファイル名を指定すると、CLIからサポートされていないので、使用している場合のみ利用可能ですコード。

Gulp sourcemaps with TypeScript and Babelが役に立ちます。有望なJSとオリジナルのTSファイルの両方を参照するソースマップを生成することができます。しかし、（その答えのコメントに記載されているように）正しいsourceRootを使用するようには見えないので、実際には存在しないソースの場所を.js.mapファイルが指しています。

非常に満足です。 :-(ここ

Answer 2

は、私はそれがうまく作ら方法ですあなたのtsconfig.jsonでは次のオプションが必要になります：。

{ 
    "compilerOptions": { 
    "inlineSourceMap": true, 
    "inlineSources": true 
    } 
} 

を次にあなたはバベル-CLIを実行したとき、あなたは--source-maps inlineに合格する必要があります。ここでbuildディレクトリにTSCの出力を想定している例のNPMスクリプトだとそのバベルは、同じディレクトリに出力されます：私が使っていた

tsc && babel build -d build --source-maps inline