28

Web アプリケーションの 2 段階のコンパイル プロセスがあります。まず、CoffeeScript ファイルを JavaScript ファイルにコンパイルします [1]。次に、JavaScript ファイル (CoffeeScript に由来するものと、AngularJS テンプレートから生成されたような外部のものの両方grunt-angular-templates) は、Google Closure Compiler [2] によって単一の最小化されたファイルにコンパイルされます。

CoffeeScript ---[1]---> JavaScript --[2]--\
                                           \->
AngularJS templates --> JavaScript ----------> single minimized JS file
                                           /->
                    other JS files -------/

手順 [1] と [2] の両方で、ソース マップが生成されます。

これらのソース マップを単一のソース マップに結合して、最小化された JS ファイルを実行する Web ブラウザーから CoffeeScript ファイルをデバッグできるようにすることは可能ですか?

つまり、ソース マップ [1] が関数で表されているとします。

f(position in CoffeeScript) = position in JavaScript

ソース マップ [2] は次の関数で表されます。

g(position in JavaScript) = position in minimized JS

関数構成で表されるソース マップを取得したいと思います。

h(position in CoffeeScript) = g(f(position in CoffeeScript)) = 
                            = position in minimized JS
4

4 に答える 4

21

ソーサリーを試してみてください- これはまさにこの目的のために設計されています (私は作成者であり、関連するツールに関する情報を探してここに来ました)。ファイルが正しい場所にある (またはデータ URI としてインライン化されている)限り、生成されたファイルを.map実行するだけでsorcery、中間ソースマップが検索され、それらが作成されます。

于 2015-05-05T20:20:57.290 に答える
3

ソース マップの仕様 (およびその他の議論) からわかる限り、マルチレベル マッピングはまだ定義されていません。

https://docs.google.com/document/d/1U1RGAehQwRypUTovF1KRlpiOFze0b-_2gc6fAH0KY0k/edit?pli=1#heading=h.e8hx254xu4sa

ソース マップ リビジョン 3; マルチレベル マッピングに関する注意事項

誰かがこれに対処するためのツールを開発している可能性があります。おそらく Github リポジトリで。もちろん、そのようなマップを生成するためのツールと、それらを使用できるブラウザーの両方があります。

https://hacks.mozilla.org/2013/05/compiling-to-javascript-and-debugging-with-source-maps/ https://github.com/fitzgen/source-map

于 2014-02-11T23:03:09.787 に答える
3

Closure Compiler が実装--apply_input_source_maps(および--parse_inline_source_maps起動) されました。ここで達成しようとしていることが正確に行われるはずです。追加のツールは必要ありません。

于 2016-09-20T05:46:37.323 に答える