3

dependencies.js ファイルに各名前空間を明示的に登録することなく、 Google Closure を使用goog.requireして JS の依存関係を管理する方法はありますか?

goog.require('myapp.module')私は実稼働用のコンパイラのアイデアが好きですが、開発用には、開発モードで自動的にインポートされるようなものmyapp/module.js(まだインポートされていない場合)、本番環境では、すべてが 1 つのファイルにコンパイルされます。

の古いバージョンがこのように機能したことを覚えているdojo.requireようです。Google Closureが同じことをできるかどうか、何か考えはありますか?

4

3 に答える 3

2

dependencies.js ファイルに各名前空間を明示的に登録することなく、 Google Closure を使用goog.requireして JS の依存関係を管理する方法はありますか?

短い答えはノーです。コンパイルされていないJavaScript コードでgoog.require()は、への呼び出しによって生成される依存関係グラフに依存します。goog.addDependency(relativePath, provides, requires).

DepsWriterのドキュメントから:

しかし、Closure Library は、どのファイルがどの名前空間を提供しているかをどのように認識するのでしょうか? Closure Library には、deps.jsという名前のデフォルトの依存関係ファイルが含まれています。このファイルには、ライブラリ内の JavaScript ファイルごとに 1 行が含まれており、それぞれがファイルの場所 ( base.jsを基準とする)、提供する名前空間、および必要な名前空間を指定しています。

デバッグ モードでは、goog.require()ステートメントは require 名前空間が指定されているかどうかを確認し、指定されている場合は、それを提供するファイルとそのすべての依存関係をフェッチします。

ただし、Closure Library には、ライブラリ内の名前空間の依存関係ファイルのみが付属しています。独自の名前空間を作成する予定がある場合 (おそらくそうなるでしょう)、 を使用depswriter.pyして、作成する名前空間の依存関係ファイルを作成できます。

そうは言っても、「RAW」モードを提供するplovrなどのツールを使用して、コンパイルせずに JavaScript ソースを連結することができます。これにより、deps ファイルを生成する必要がなくなりますが、ブラウザーでコードをデバッグするときに、コードを含む元のファイルを特定することがより困難になります。

于 2012-10-14T22:28:09.010 に答える
2

Closure ツールには、必要なものを正確に生成する calcdeps.py という python スクリプトがあります。

goog.provide/goog.require の使用を開始する:

  • 必要な名前空間に一致するように、ファイルをディレクトリ構造に編成します。つまり、名前空間「grantys.awesome.lib.Math」を宣言する場合、ディレクトリ構造は grantys/awesome/lib/Math.js のようになります。

  • 依存関係として追加する各ファイルでは、最初の JavaScript 関数呼び出しは goog.provide('grantys.awesome.lib.Math') にする必要があります。別のファイルに依存するには、 goog.require('grantys.awesome.lib.Constants') で要件を宣言します。*これは重要です。goog.provide は、calcdeps.py が各ファイルが提供できるものを把握するために使用するものです。コンパイルされていない場合、提供している名前空間がそのファイルで構築しているものであるという保証はまったくありません。

  • 適切な引数 ( goog.provide('some.library') を含むか含まないファイルを検索するためのパス、書き込むファイル名など) を指定して calcdeps.py を実行します。これにより、手動で記述した goog.addDependency ステートメントを含むファイルが生成されます。また、calcdeps が生成する deps ファイルは、出力ファイルを書き込んでいるディレクトリから見た相対パスを使用することに注意してください (常にコマンドを実行するディレクトリとは限りません)。

calcdeps.py の出力例:

goog.addDependency("../site/ui/MurphyBed.js", ['site.ui.MurphyBed', 'site.ui.MurphyBed.State', 'site.ui.MurphyBed.EventType', 'site.ui.MurphyBed.Error'], ['goog.dom', 'goog.object', 'goog.events', 'goog.events.EventTarget', 'site.fx.easing', 'goog.fx.dom', 'goog.fx.AnimationSerialQueue']);
goog.addDependency("../site/ui/SliderButton.js", ['site.ui.SliderButton'], ['goog.ui.CustomButton', 'site.ui.SliderButtonRenderer', 'goog.fx.dom', 'site.fx.easing']);

  • HTML に、Google の base.js スクリプトを含めます。これは goog オブジェクトを宣言します。base.js スクリプト タグの後に、上記の calcdeps.py を使用して作成した、生成された deps.js ファイルを参照するタグを追加します。

  • goog.require('grantys.awesome.lib.Math') を使用して依存関係を読み込みます。

注: 依存関係を変更した場合は、calcdeps.py を再実行する必要があります。私自身の解決策は、正しい引数を使用してシェルスクリプトでラップすることでした。そのため、ファイルの再スキャンが必要な変更を行うときは、./calcdeps.sh を実行するだけです。

于 2012-10-25T05:14:14.367 に答える
1

base.jsファイルは関数を定義しますgoog.require()。関数呼び出しは、名前空間goog.require('goog.dom')内の関数を定義する JavaScript ファイルを、goog.domそれらの関数が必要とする Closure Library からの他のファイルと共にロードします。

于 2012-10-13T18:06:48.817 に答える