コンポーネントは 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.jsやnbd.jsなどのマイクロ ライブラリを使用してみることができます(開示: 私は nbd.js の作成者です)。
nbd.js を使用する場合、pubsub 機能以上のものを提供します。ただし、具体的require()
には pubsub モジュールのみにすることができます。
ソース管理に git を使用している場合は、サブモジュールとして使用するのが最も簡単です。
git submodule add git@github.com:behance/nbd.js.git path/to/nbd
次に、require
pubsub モジュールを実行して、やりたいことを実行してください。
require(['nbd/trait/pubsub'], function(pubsub) { /* do whatever */ });