0

AMDモジュールの作成に関するAddyOsmaniの優れたブログ投稿を読んでいます。私は彼の投稿から持ち上げたjsの単純なチャンクから始めます:

define('modTest', [],
  // module definition function
  function () {
      // return a value that defines the module export
      // (i.e the functionality we want to expose for consumption)

      // create your module here
      var myModule = {
        doStuff:function(){
          console.log('Yay! Stuff');
        }
      }

      return myModule;
  }
);

fooとへの依存関係を削除しましたbar。コンソールにログを記録する単純なオブジェクトが必要です。

だから私はそれを保存して/js/modTest.jsからそれをロードしようとします:

curl(['/js/modTest.js'])
 .then(function(mt) {
     console.log("Load complete"); 
     console.log("mt:"); 
     console.log(mt); 
     mt.doStuff()
  }, function(ex) {alert(ex.message);})

結果:エラー:Multiple anonymous defines in URL。OK、うまくいきませんでした。名前空間に追加しようとしました:define('myCompany/modTest', [],、同じ結果。依存関係配列に空の文字列を追加しようとしましたが、同じ結果です。

curl(['modTest.js'], function(dep){console.log(dep)});同じ結果で試してみました。

Addyのブログ投稿のコードは正しくありませんか?私は何か間違ったことをしていますか?たぶんカールのバグ?

アップデート5/24:require.jsを優先してcurl.jsを捨てました。奇数エラーはゼロで、切り替える作業はほとんどありません。コードをクライアント側とサーバー側で実行するには、amdefineを少し処理する必要がありました(1つのオブジェクトが両方の場所にあるため、gruntを構成してそれを処理する必要がありました)。私の定義は一般的に次のようになります。

define(->
    class AlphaBravo 
    ... 

また、読み込みに問題はありません。

4

3 に答える 3

1

curl() に「/js/modTest.js」というモジュールを取得するように依頼しました。ファイルを見つけてロードし、「modTest」という名前のモジュールを見つけたので、文句を言いました。:) (しかし、そのエラーメッセージはひどく間違っています!)

これを修正する方法は次のとおりです(いずれかを選択してください)。

1) define() から ID を削除します。IDはお勧めしません。これは通常、AMD ビルド ツールでのみ使用され、テスト ハーネス内でモジュールを宣言するときにのみ使用されます。

2) define() で指定した ID でモジュールを参照します。(繰り返しますが、ほとんどの場合、ID は推奨されません。)

curl(['modTest'], doSomething);

3) アプリケーションのモジュールを含むフォルダーにパッケージ (またはパス) をマップします。modTest はスタンドアロン モジュールのように見えるので、それがあなたの例からどうなるかはわかりません。ただし、アプリのファイルを「アプリ」パッケージの下に整理することにした場合、パッケージ構成は次のようになります。

packages: [ { name: 'app', location: 'app' } ]

次に、modTest モジュールに依存するコードがある場合は、「app/modTest」の ID を介してアクセスできます。

curl(['app/modTest'], doSomething);

それが問題を解決するのに役立つことを願っています!

Fwiw、Addy の例は実際には適切な構成で動作する可能性がありますが、その投稿には構成が表示されません (または、私の目が見逃していました)。このようなものがうまくいくかもしれません:

packages: [ { name: 'app', location: '.' } ]

-- ジョン

于 2013-03-05T18:34:58.510 に答える
0

他のライブラリに使用していたインクルード順序であることが判明した同様の問題が発生しました。handlebars.js、crossroads.js、jquery、およびその他のいくつかのライブラリを従来の方法 (スクリプト タグを頭に) でプロジェクトにロードしていますが、curl.js インクルードを最初に配置すると、このエラーが発生することがわかりましたが、最後に含めると、このエラーは発生しません。

私の head タグは次のようになります。

<script type="text/javascript" src="/js/lib/jquery.js"></script>
<script type="text/javascript" src="/js/lib/signals.js"></script>
<script type="text/javascript" src="/js/lib/crossroads.js"></script>
<script type="text/javascript" src="/js/lib/handlebars.js"></script>
<script type="text/javascript" src="/js/lib/curl.js"></script>
<script type="text/javascript" src="/js/main.js"></script>
于 2013-03-05T11:59:26.887 に答える
0

通話に問題がありますdefine。それはNAMEDです

定義の書き方の全容については、 AMD の仕様を参照してくださいjs/modTest.js

define(/* this is where the difference is */ function () {
      // return a value that defines the module export
      // (i.e the functionality we want to expose for consumption)

      // create your module here
      var myModule = {
        doStuff:function(){
          console.log('Yay! Stuff');
        }
      }

      return myModule;
  }
);

さて、退屈な説明:

CurlJS は素晴らしいです。実際、RequireJS と CurlJS の両方を扱った後、CurlJS は 1 つのカテゴリ (スクリプト実行順序の信頼性) で RequireJS よりも優れていると言えます。だからあなたは正しい軌道に乗っています。

CurlJS の主な違いの 1 つは、「ロードされたモジュールごとに少なくとも 1 つの匿名定義を見つけ、それ以外の場合はエラー」ロジックを使用することです。RequireJS はタイムアウトを使用し、特定のファイルに何も定義されていない場合を効果的に無視しますが、読み込み/解析エラーが発生すると爆発します。

その違いがあなたをここに連れてきたのです。CurlJS は、読み込まれたモジュールごとに少なくとも 1 つの匿名(NOT 名前付き) 定義を想定しています。期待どおり、名前付き定義を引き続き適切に処理します。「js/modTest.js」の内容をインライン コードに移動した瞬間に、定義に「名前を付ける」必要があります。しかし、それは別の話です。

于 2013-03-05T18:31:02.220 に答える