LoginSignup
2
2

More than 5 years have passed since last update.

Rails4で任意に追加したディレクトリのアセットファイルが読み込まれない

Last updated at Posted at 2016-05-03

Rails4で任意に追加したディレクトリのアセットファイルが読み込まれない

開発環境developmentをコピーしたdevelopment_twoという環境で開発中。
1つのRailsでサブドメイン毎に読み込むアセットファイルを分ける目的で、マニフェストとアセットファイルの置き場所を別なディレクトリにして管理を楽にしようと思った。

app/
  |- assets/
  |- assets_two/
  |    |- javascripts/
  |    |    |- applicatioin-two.js
  |    |- stylesheets/
  |    |    |- applicatioin-two.css

こちらの記事「Rails Asset Pipelineがうまくいかないときの問題の切り分けかた」が大変参考になったのだが、内容通りに設定してもどうもうまくいかない。ディレクトリ assets_two 下のファイルを認識してくれない。

実行時の Rails.application.config.assets.paths は、こう。
config/environments/development_two.rb にてディレクトリを追加するように設定してある。

["/home/moretz/var/src/myapp/app/assets/images",
 "/home/moretz/var/src/myapp/app/assets/javascripts",
 "/home/moretz/var/src/myapp/app/assets/stylesheets",
 "/home/moretz/var/src/myapp/vendor/assets/fonts",
 "/home/moretz/var/src/myapp/vendor/assets/javascripts",
 "/home/moretz/var/src/myapp/vendor/assets/stylesheets",
 "/home/moretz/.rbenv/versions/2.2.2/lib/ruby/gems/2.2.0/gems/jquery-rails-4.0.4/vendor/assets/javascripts",
 "/home/moretz/.rbenv/versions/2.2.2/lib/ruby/gems/2.2.0/gems/jquery-ui-rails-5.0.5/app/assets/images",
 "/home/moretz/.rbenv/versions/2.2.2/lib/ruby/gems/2.2.0/gems/jquery-ui-rails-5.0.5/app/assets/javascripts",
 "/home/moretz/.rbenv/versions/2.2.2/lib/ruby/gems/2.2.0/gems/jquery-ui-rails-5.0.5/app/assets/stylesheets",
 "/home/moretz/.rbenv/versions/2.2.2/lib/ruby/gems/2.2.0/gems/bootstrap-datepicker-rails-1.5.0/vendor/assets/javascripts",
 "/home/moretz/.rbenv/versions/2.2.2/lib/ruby/gems/2.2.0/gems/bootstrap-datepicker-rails-1.5.0/vendor/assets/stylesheets",
 "/home/moretz/.rbenv/versions/2.2.2/lib/ruby/gems/2.2.0/gems/twitter-bootstrap-rails-3.2.0/app/assets/fonts",
 "/home/moretz/.rbenv/versions/2.2.2/lib/ruby/gems/2.2.0/gems/twitter-bootstrap-rails-3.2.0/app/assets/images",
 "/home/moretz/.rbenv/versions/2.2.2/lib/ruby/gems/2.2.0/gems/twitter-bootstrap-rails-3.2.0/app/assets/javascripts",
 "/home/moretz/.rbenv/versions/2.2.2/lib/ruby/gems/2.2.0/gems/twitter-bootstrap-rails-3.2.0/app/assets/stylesheets",
 "/home/moretz/.rbenv/versions/2.2.2/lib/ruby/gems/2.2.0/gems/twitter-bootstrap-rails-3.2.0/vendor/assets/stylesheets",
 "/home/moretz/.rbenv/versions/2.2.2/lib/ruby/gems/2.2.0/gems/coffee-rails-4.1.0/lib/assets/javascripts",
 "/home/moretz/var/src/myapp/app/assets_two/images",
 "/home/moretz/var/src/myapp/app/assets_two/javascripts",
 "/home/moretz/var/src/myapp/app/assets_two/stylesheets"]

事象1: マニフェストファイルが認識されない

erb に、

sample1.html.erb
  <%= stylesheet_link_tag 'application-two' %>
  <%= javascript_include_tag 'application-two' %>

とすると、

sample1.html
  <link rel="stylesheet" media="screen" href="/stylesheets/application-two.css" >
  <script src="/javascript/application-two.js"></script>

とレンダリングされる。もちろん当該のソースはNot Found。
/stylesheet//javascript/ の絶対URLでレンダリングされるのは、そもそも application-two.(js|css)が認識されていないのではないか、と考える。

事象2: ディレクティブで指定したファイルが認識されない

とりあえず、従来の app/assets/(javascripts|stylesheets)ディレクトリにapplication-two.(js|css)をコピーしたところ、認識してくれたっぽい。
ただし、エラーが出る。
ディレクティブで指定したcss.scssファイル、

application_two.css
 *= require styles-two

が見つからないよ、とのことだ。

ActionView::Template::Error (couldn't find file 'styles-two'
  (in /home/moretz/var/src/myapp/app/assets/stylesheets/application-two.css.scss:15)):
...snipped...

む~ん。。。
結局のところ、やはり追加したディレクトリは認識されていないようだ。

Workaround: config.assets.paths 内のパスの順番を変えた

試しに、Rails.application.config.assets.paths 内のパスの順番を変えてみたところ、当初の期待通りにレンダリングしてくれた。

expected_result.html
  <link rel="stylesheet" media="all" href="/two/assets/application-two.css?body=1" />
<link rel="stylesheet" media="all" href="/two/assets/styles-two.css?body=1" />
  <script src="/two/assets/jquery-2.2.3.js?body=1"></script>
<script src="/two/assets/jquery_ujs.js?body=1"></script>
<script src="/two/assets/application-two.js?body=1"></script>
...snip...

変更箇所は、設定ファイル environments/development_two.rb のパスの追加部分。
もともと次のような設定で、config.assets.paths の配列の末尾に追加するようにしていた。

environments/development_two.rb
  config.assets.configure do |env|
    Rails.application.config.assets.paths.concat(
      env.paths.grep(%r|#{Rails.root}/app/assets/|).map!{ |p| p.gsub(%r|/assets/|, "/assets_two/") }
    )
  end

これを、次のように、配列冒頭に追加するように設定し、再起動した。

environments/development_two.rb
  config.assets.configure do |env|
    env.paths.grep(%r|#{Rails.root}/app/assets/|).each do |p|
      p.gsub!(%r|/assets/|, "/assets_two/")
      Rails.application.config.assets.paths.unshift( p )
    end
  end

なお、config.assets.configure のブロック内で参照できる paths(上記コードだとenv.paths)は、オリジナルの配列からdupされたものなので、これを変更しても効果はない。

原因

原因は調査しきれていない。
Gemの影響かなと思い、config.assets.paths の配列中に見えるGemを順番に外していったが、全て外しても同様の事象になる。
単純な配列の順番が問題のように見える。

Sprockets Railsのソースなどを追えばよいかもしれぬが…。Railsのバージョンにもよるのかな。
とかなんとかそれっぽいこと言って、実は単純なミスや理解不足だったらやだな…^^;

時間のあるときにもう少し調べてみようかと思っている。
そして、何か知っている人がいたら教えてほしい。

ちなみに、Ruby/Railsのバージョンと、environment/development_two.rb で設定している他の config.assets のパラメタは次のとおり。

$ ruby --version
ruby 2.2.2p95 (2015-04-13 revision 50295) [x86_64-linux]
$ rails --version
Rails 4.2.1
  config.assets.debug = true
  #config.assets.digest = false    #デフォルト値のまま
  config.assets.raise_runtime_errors = true
  config.assets.compress = false
  config.assets.precompile += [/(?:\/|\\|\A)application-two\.(css|js)$/]
  config.assets.prefix = "/two/assets"

(おわり)

2
2
2

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
2