Rails 3.1.0 のアセット パイプライン

アセット パイプラインは、JavaScript および CSS アセットを連結して縮小または圧縮するためのフレームワークを提供します。また、これらのアセットを CoffeeScript、Sass、ERB などの他の言語で作成する機能も追加されます。 Rails 3.1 では、rails アセット パイプラインがデフォルトで有効になっています。アプリケーション クラス定義内に次の行を追加することで、config/application.rb で無効にできます。

config.assets.enabled = false

新しいアプリケーションの作成中に、-skip-sprockets オプションを渡すことでアセット パイプラインを無効にすることもできます。

Rails の新しいアプリ名 –skip-sprockets

アセットパイプラインの特徴:

1.資産を連結する

この機能は、Web ページをレンダリングするためにブラウザーが行う必要があるリクエストの数を減らすことができるため、運用環境では重要です。 Web ブラウザーは同時に実行できるリクエストの数に制限があるため、リクエストが少ないほどアプリケーションの読み込みが速くなります。

レール 2.x では、javascript_include_tag メソッドと stylesheet_link_tag メソッドの最後に :cache => true を配置することで、JavaScript と CSS アセットを連結する機能が導入されました。ただし、この手法にはいくつかの制限があります。たとえば、キャッシュを事前に生成することはできず、サードパーティのライブラリによって提供されるアセットを透過的に組み込むこともできません。

2.資産の縮小または圧縮

CSS ファイルの場合、圧縮は空白とコメントを削除することによって行われます。 JavaScript の場合は、より複雑な処理を適用できます。一連の組み込みオプションから選択することも、独自のオプションを指定することもできます。

3.実際のアセットまでプリコンパイルされ、高レベル言語を介してアセットをコーディングできます。デフォルトでサポートされる言語には、CSS の Sass、JavaScript の CoffeeScript、および両方の ERB が含まれます。 Rails アセット パイプラインの古いバージョンでは、すべてのアセットは画像、JavaScript、スタイルシートなどの public のサブディレクトリにあります。

アセット パイプラインでは、これらのアセットの優先場所は app/assets ディレクトリになりました。このディレクトリ内のファイルは、sprockets gem に含まれる Sprockets ミドルウェアによって提供されます。アセットは引き続きパブリック階層に配置できます。公開されているアセットはすべて、アプリケーションまたは Web サーバーによって静的ファイルとして提供されます。提供する前に前処理が必要なファイルには app/assets を使用する必要があります。

本番環境では、Rails はデフォルトでこれらのファイルを public/assets にプリコンパイルします。プリコンパイルされたコピーは、Web サーバーによって静的アセットとして提供されます。アプリ/アセット内のファイルが本番環境で直接提供されることはありません。

スキャフォールドまたはコントローラーを生成すると、Rails は JavaScript ファイル (または、Coffee-Rails gem が Gemfile 内にある場合は CoffeeScript ファイル) と Cascading Style Sheet ファイル (または sass-rails が Gemfile 内にある場合は SCSS ファイル) も生成します。そのコントローラー。

資産構成:

Rails 3.0 アプリと Rails 3.1 アプリの実質的な最大の違いは、画像、スタイルシート、JavaScript ファイルなどのアセット ファイルの場所の変更です。 Rails アセット パイプラインの以前のバージョンでは、これらのファイルはすべて public/ ディレクトリに存在していました。

公開/画像/

パブリック/スタイルシート/

パブリック/JavaScript/

Rails 3.1 および Rails 3.2.3 では、これらのファイルの場所は、ファイルが当社によって作成されたか、外部ベンダーから提供されたかによって異なります。この場合、ファイルは app/assets ディレクトリに存在します。

アプリ/アセット/画像/

アプリ/アセット/スタイルシート/

アプリ/アセット/JavaScript/

外部ベンダーからのコードまたはイメージの場合は、vendor/assets ディレクトリを使用します。

ベンダー/アセット/イメージ/

ベンダー/アセット/スタイルシート/

ベンダー/アセット/JavaScript/

マニフェストファイル

これらは、ディレクティブ プロセッサ、コメント行とそれに続く = を含むプレーンな js または css ファイルです。

// …

//= jQueryが必要

//= jquery_ujs が必要

//= require_tree 。

または：

/* …

*= require_self

*= require_tree 。

これらのマニフェスト ファイルは、依存する他のアセットを参照し、含めます。 require_directory と require_tree を使用すると、ディレクトリ全体とその子を要求できます。require_self には、マニフェスト ファイル自体に js または css も含まれます。