76

CommonJSモジュールをクライアント側のJavaScriptコードとしてブラウザーにロードする最良の方法は何ですか？

CommonJSモジュールは、その機能をmodule.exports名前空間に配置し、通常require(pathToModule)、サーバー側スクリプトで使用して含まれます。それらをクライアントにロードすることは同じように機能することはできません（requireを置き換える必要がある、非同期性を考慮する必要があるなど）。

私はモジュールローダーと他の解決策を見つけました：Browserify、RequireJS、yabbleなどまたは単にモジュールを変更する方法。最善の方法とその理由は何だと思いますか？

4

6 に答える 6

50

私は過去にRequireJSを広範囲に使用しました（2010年のBBC iPlayerでの実装）、そしてそれはうまく機能します。CommonJSモジュールを処理できますが、追加のラッパーが必要であり、これは面倒です。

Node.jsでもこれらのモジュールを使用する場合は、サーバー側でもRequireJSを使用する必要がありますが、これは慣用的なNode.js JavaScriptコードではないため、使用するのは好きではありません。

私は過去1年間にいくつかのプロジェクトでwebmakeとBrowserifyを使用しました。当初、コンパイルのステップは私を先延ばしにしましたが、今年それを広く使用したので、これは問題ではないと言えます。

Browserifyには監視機能が含まれており、非常にうまく機能します。Webmakeはウォッチャー（watcherなど）に接続できます。または、Express.jsまたは接続アプリケーションの一部として使用できるwebmake-middlewareモジュールを使用できます。これには、保存ごとにJavaScriptをコンパイルするのではなく、実際にリクエストしたときにのみコンパイルされるという利点があります。

Connectを使用すると、サーバー（静的）を簡単に作成できるため、バックエンドなしでフロントエンドを開発する場合は、ファイルを提供する小さな静的Node.jsサーバーを作成できます。

ボーナス：ビルドされたコードを常に処理するため、ビルドスクリプトは必要ありません。

于 2012-09-29T15:53:05.027 に答える
21

GitHubでのそれぞれの人気（ウォッチャーの数）順に並べられた現在のオプションの包括的なリストは次のとおりです。

ブラウザでrequire（）を使用するためのオプション（Wayback Machineアーカイブ）

于 2012-03-06T11:39:41.923 に答える
13

Browserifyを使用します。

その説明は次のとおりです。「ノードモジュールとnpmパッケージのブラウザ側require（）」これは必要なものに聞こえます。

于 2011-09-28T03:09:33.110 に答える
2

CommonJSコンパイラ。

なんで？Node.js（CommonJS）モジュール/treatモジュールでNode.jsとまったく同じように正常に動作し、UMDを使用すると、コンパイルされたJavaScriptに最小限の追加コードをもたらし、サードパーティライブラリのグローバル変数をコードやソースマップに触れることなくエクスポートできます。他の人ができないトリック：

var str = require( "lorem-ipsum.txt" );
console.log( str );

出力：

 Lorem ipsum dolor
 sit amet, consectetur
 adipiscing elit. Morbi...

スライドは次のとおりです：https ：//speakerdeck.com/dsheiko/modular-javascript-with-commonjs-compiler

于 2015-01-27T16:23:01.867 に答える
0

Webmakeはオプションの1つです。私はそれを使用して、20を超えるパッケージの200を超えるモジュールから構築されたアプリケーションをパックします。できます。

いくつかの例を見たい場合は、SoundCloudプレイリストマネージャーを確認してください。これは厳密にクライアント側であり、Webmakeで構築されています。

于 2012-07-26T19:06:52.620 に答える
-2

あなたがここにリストした他のものを試したとは言えませんが、私はRequireJSが好きです。理由は次のとおりです。

  • CommonJSと同じように機能します
  • 使いやすい
  • 今後の新しい標準のいくつかを実装します
  • Node.jsで使用できるため、サーバーとクライアントで同じファイルを使用できます
  • 本番環境にデプロイするためのミニファイア/パッカーが含まれています
  • プラグインがあります。HTMLファイルをロードできるTextプラグインは、大規模なアプリケーションに非常に役立ちます。
于 2011-09-27T23:45:41.083 に答える