web-dev-qa-db-ja.com

1ページだけにコーヒースクリプトファイルを含めるにはどうすればよいですか？

編集：1年後、これをもう一度行う場合は、Railsアセットパイプラインの代わりに、curl.jsを使用して行います。

関連： a Rails 3 app？ にページ固有のJavaScriptを追加する最良の方法

私はアプリを作成し、coffeescriptを使用してすべてのjsを生成しています。そのため、関連する質問では必要なことが実行されません。

アセットディレクトリのサブフォルダにcoffeescriptファイルを配置し、その.coffeeファイルを1ページにのみ表示できるようにしたいと思います。ページは名前付きルート上にあります

match 'myNotifications' => 'user#notifications'

最も明白なことは、.coffeeファイルをassets\javascripts\user\index.js.coffeeに置くことでした。しかし、アセットに関するドキュメントを読んだ後、私にはわかりません。

私はこの行を読みました（ http://guides.rubyonrails.org/asset_pipeline.html から）：

コントローラに固有のJavaScriptまたはCSSは、それぞれのアセットファイル内に配置する必要があります。これらのファイルは、<％= javascript_include_tag params [：controller]％>または<％= stylesheet_link_tag params [などの行を使用して、これらのコントローラに対してのみロードできます。 ：コントローラー]％>。

かっこいいので、ページ固有のjsをassets\javascripts\user.js.coffeeに入れました。次に、ホームページCtrlF5をリロードしました。 user.jsファイルはまだホームページにロードされています。 $ -> alert 'ready from users controller'でテスト済み。ホームページをロードすると、そのアラートが表示されます。

Railsは、そのページでのみ提供されるページごとのコーヒースクリプトファイルを作成する方法がありますか？マニュアルを間違って読んでいますか？アセットフォルダーにできる場所はありますか？すべてのページで読み込まれない場所に.coffeeファイルを配置しますか？

更新：私がそうかもしれないように見えます 答えがあります ：

この問題を回避するには、いくつかの方法があります。 require_treeの代わりにrequire_directoryを使用できます。これは、ファイルを現在のディレクトリにのみロードし、サブディレクトリにはロードしないためです。含まれるファイルをより細かく制御したい場合は、ディレクトリ全体を含めるのではなく、個別に要求することができます。または、すべてのページに含めるJavaScriptファイルをパブリックサブディレクトリに移動することもできます。次に、require_tree ./publicを使用して、これらのファイルのみを含めることができます。

午前中にそのショットを与えます。

ruby-on-railsruby-on-rails-3coffeescript
25
jcollum

1つのページにファイルを含めるだけでなく、ページのマークアップを条件とするロジックを使用することもできます。 関連する質問に対する私の回答 を参照してください。そうすれば、ユーザーは特定のページに対して追加の<script>リクエストを行う必要がありません。

そのページに固有のロジックのlotがある場合（たとえば、10K +縮小）、はい、分割します。質問の編集で提案したように、javascriptsディレクトリのルートでrequire_tree .を実行するのではなく、代わりにglobalというサブディレクトリを作成し、application.jsの先頭をから変更します。

require_tree .

に

require_tree global

次に、ページ固有のCoffeeScriptファイルをルートjavascriptsディレクトリに置き、そのページのテンプレートでjavascript_include_tag呼び出しを使用してそのファイルをポイントします。

10
Trevor Burnham

コントローラ/ビュー固有のコーヒーを作成するために使用するアプローチは次のとおりです。

application.html.haml：

%body{ :data => { :controller => params[:controller], :action => params[:action]} }

alt。 application.html.erb

<%= content_tag(:body, :data => { :controller => params[:controller], :action => params[:action] }) do %>
  ...
<% end %>

application.js.coffee：

$(document).ready ->
  load_javascript($("body").data('controller'),$("body").data('action'))

load_javascript = (controller,action) ->
  $.event.trigger "#{controller}.load"
  $.event.trigger "#{action}_#{controller}.load"

users.js.coffee

$(document).bind 'edit_users.load', (e,obj) =>
  # fire on edit users controller action

$(document).bind 'show_users.load', (e,obj) =>
  # fire on show users controller action

$(document).bind 'users.load', (e,obj) =>
  # fire on all users controller actions

補足：

これはPJAXでうまく機能し、PJAXリクエストの応答ヘッダーでコントローラー/アクション名を渡し、それに基づいてこれらのjs関数を起動することができます。

EDIT（2014/03/04）:このソリューションは、turbolinks.jsを使用している場合でも機能します。

22
zeeraw