2

RequireJS を使用して多数の JavaScript ファイルを最適化しようとしていますが、オプティマイザを使用してスクリプトを適切に構築し、それらをブラウザに適切な方法でロードする方法に頭を悩ませています。

以下の説明は具体的なものですが、他にも多くの人が同じ課題に直面していると思います。(または、彼らは要件でより賢明な選択をしました!)

bowerを使用してスクリプトのカタログをダウンロードしています。これらのスクリプト (またはその一部) を Web ページに含めたいと考えています。

さらに、テスト中は、基本的にブラウザーに個々の bower スクリプトを取得させたくありません。ローカル テスト フレームワークは要求に連続して応答するため、これは非常に低速です。RequireJS オプティマイザーまたはその他の方法を使用して、ダウンロードしたすべての bower スクリプトを 1 つのファイルに結合したいと考えています。

対照的に、私自身のコードは Coffeescript ファイルの長いリストに分割されており、RequireJS CS プラグインを使用してそれらをブラウザー用にコンパイルしたいと考えています。

そのときの開発では、ブラウザが次のようなものをロードすることを期待していました。

  • components.js
  • main.js
    • csmain.coffee
    • my_module.coffee

これcomponents.jsは、bower のcomponentsディレクトリにある次のファイルで構成されます。

  • jquery: jquery/jquery
  • jqueryui:
    • jquery-ui/ui/jquery.ui.core
    • jquery-ui/ui/jquery.ui.datepicker
  • 増幅:
    • 増幅/コア/増幅.コア
    • 増幅/リクエスト/増幅.リクエスト
  • ブートストラップ:
    • ブートストラップ/js/ブートストラップ遷移
    • ブートストラップ/js/ブートストラップ-アラート
    • ブートストラップ/js/ブートストラップボタン
    • ブートストラップ/js/ブートストラップ-カルーセル
    • ブートストラップ/js/ブートストラップ-折りたたみ
  • ロダッシュ:ロダッシュ/ロダッシュ

実稼働環境では、ブラウザーは 1 つのファイル (たとえばall.js.

私の質問は次のとおりです。RequireJS を使用すると、ブラウザーmain.jsとビルド スクリプトに入り、部分的および完全に最適化されたビルドを実現できます。私はこの問題に不釣り合いなほど多くの時間を費やしましたが、RequireJS からの不可解で不可解なエラーの数は、悲劇的なほど長くなりました。仕事のツールではないようですが、修正していただければ幸いです。

私が持っている最適化スクリプトは次のようなものです (YAML 表記):

baseUrl: "../media/my-scripts/"
optimize: none
out: build/all.js
stubModules:
 - cs
 - coffee-script
paths:
  cs: "../../scripts/components/require-cs/cs"
  'coffee-script': "../../scripts/components/require-cs/coffee-script"
  usf: "./main"
  components: "../compiled/components"
name: usf
logLevel: 0
shim: # ...

私が解決したい問題はかなり単純なようですが、解決策はすぐには見つかりません。RequireJS は素晴らしいものですが、私が必要としているものよりも劇的に複雑です。Almond.jsはモジュールをロードするための代替手段ですが、問題は代替の適切なオプティマイザがないことにあります。

上記を達成するために使用できるオプションr.js、または代わりにどのような適切な代替最適化ソリューションが存在するかについての考えに感謝します。

4

1 に答える 1

1

答えが見つからなかったので、この問題を解決するためにYAMDOを書きました 編集その後、そのプロジェクトを非推奨にし、すばらしいBrowserifyプロジェクトに落ち着きました。

于 2013-01-08T14:40:06.273 に答える