12

Require.jsチェーンに含めたいモジュールがあります。(より具体的には:https ://github.com/component/emitter )

私が得るブラウザで: uncaught reference error: module is not defined

モジュールのエクスポートでは、次のように定義されます。 module.exports = Emitter;

これはAMD/ノードウェイと呼ばれていると思います。間違っている場合は正しくお願いします。

いずれにせよ、require.jsがブラウザで何らかの形でモジュール化できるようにしたいと思います。Require.jsの宣言型シミングオプションが役立つと思いましたが、それでも上記のエラーが表示されます。

モジュールに手動でパッチを適用せずに、これをどのように解決できますか?(私が設定した自動ビルドプロセスを維持したいので)

4

1 に答える 1

5

コンポーネントは CommonJS モジュールです

コンポーネント フレームワークは、CommonJS モジュール形式で記述されたコンポーネントのコレクションです。module.exportモジュールの意図した値は、JS ランタイムによって提供されることを意図した と呼ばれる「魔法のプロパティ」に単純に割り当てられます。

CommonJS モジュールは特定のワークフローを想定しているため、これは Web JS ランタイムの動作方法ではありません。ファイルがロードされたことを同期的に保証する機能がなければ (または、ロードされていないときに壊滅的に失敗する)、ブラウザはスタンドアロン環境と同じワークフローをサポートできません。したがって、CommonJS 形式で記述されたものはすべて、それを考慮してラップする必要があります。

RequireJS のような AMD スタイルのモジュール ローダーで CommonJS モジュールを使用するには、必要なモジュールを自分でラップするか、r.js ビルド ツールを使用します。

CommonJS モジュールを手動でラップする

define(function(require, exports, module) {
  //Put traditional CommonJS module content here
});

From : CommonJS Notes

r.jsで自動ラッピング

r.js -convert path/to/commonjs/modules path/to/converted/modules

ですでにインストールされているr.jsとしnpm -g i requirejsます。

特定の問題を解決する

ただし、これは「非同期ワークフローで CommonJS モジュールを使用するにはどうすればよいですか?」というより一般的な問題を解決しているだけです。あなたが実際に達成しようとしているように見えるのは、自分で記述せずにイベント システムを取得できるようにすることです。

これをクライアント側にロードしているため、この機能を既に提供しているクライアント側ライブラリがたくさんあります。これを提供する最も人気のあるライブラリは、おそらくBackbone.js の Eventsです。バックボーン イベントを使用する利点は、バックボーンが十分にサポートされ、十分に文書化されていることです。欠点は、Backbone が別の依存関係 (独自の依存関係である Underscore を含む) をロードする必要があることです。さらに、Backbone はグローバル変数にエクスポートするため、それを可能にするには RequireJS shim 構成を宣言する必要がありますrequire()

本当にAMD

聖杯は、小型で AMD と互換性のある EventEmitter タイプ ライブラリです。そのために、 pubsub.jsnbd.jsなどのマイクロ ライブラリを使用してみることができます(開示: 私は nbd.js の作成者です)。

nbd.js を使用する場合、pubsub 機能以上のものを提供します。ただし、具体的require()には pubsub モジュールのみにすることができます。

ソース管理に git を使用している場合は、サブモジュールとして使用するのが最も簡単です。

git submodule add git@github.com:behance/nbd.js.git path/to/nbd

次に、requirepubsub モジュールを実行して、やりたいことを実行してください。

require(['nbd/trait/pubsub'], function(pubsub) { /* do whatever */ });
于 2013-07-28T19:54:40.643 に答える