web-dev-qa-db-ja.com

sass-Railsヘルパー「image-url」、「asset-url」がRails 3.2.1で機能していません

私は3.2.1で、sass-Rails-3.2.4とsass-3.1.15を使用しています...

アセットパイプラインのドキュメントには次のように記載されています。

asset-url("Rails.png", image) becomes url(/assets/Rails.png)
image-url("Rails.png") becomes url(/assets/Rails.png)

...

そこで、次のファイルを作成しました。

# app/assets/stylesheets/public/omg.css.sass

body
  background: asset-url('snake.gif', image)

#lol
  background: image-url('snake.gif')

localhost:3000/assets/public/omg.cssにアクセスすると、次のメッセージが表示されます。

body {
  background: asset-url("snake.gif", image); }

#lol {
  background: image-url("snake.gif"); }

...また、ファイルをomg.css.scssに変更して、構文を次のように変更しました。

# app/assets/stylesheets/public/omg.css.scss

body {
  background: asset-url('snake.gif', image);
}

#lol {
  background: image-url('snake.gif');
}

しかし、同じ結果が得られます...これらのヘルパーが機能しない理由は誰にもわかりませんか?

45
patrick

ドキュメンテーションに書かれていることにもかかわらず、Rails 3.2.6のデフォルトオプションにより、CSSでさらに少ないパス情報で動作させることができます。例えば_../app/assets/images/Rails.png_はexample.css.scssファイルに次のようなものを追加します。

background: white url(Rails.png) repeat-y;

Scssに_image-url_または_asset-url_を含めないでください(私が知る限り)、ただのurl(your_image.png)です。ドキュメントのそのビットは、それがバックグラウンドで何をしているかの単なる説明のように見えます。

33
Jay H.

この問題が発生したのは、プリコンパイルのためにアセットパイプラインにcssファイルを含めなかったためです。その結果、実行時に生成されます。 sass-Rails gemは通常:assetsグループに含まれているため、実行時にcssファイルを生成する際にヘルパーを使用できません。

Application.rb(またはproduction.rb)に次の行を追加してみてください。

config.assets.precompile += %w( public/omg.css )

この投稿 の修正を見つけました。ファイルをプリコンパイラに追加する際のファイル名の付け方に関する落とし穴が含まれています。

11
Forrest

過去にアプリをRails 3.1に更新した場合は、application.rbファイルを変更してください。

# If you have a Gemfile, require the gems listed there, including any gems
# you've limited to :test, :development, or :production.
Bundler.require(:default, Rails.env) if defined?(Bundler)

if defined?(Bundler)
  # If you precompile assets before deploying to production, use this line
  Bundler.require *Rails.groups(:assets => %w(development test))
  # If you want your assets lazily compiled in production, use this line
  # Bundler.require(:default, :assets, Rails.env)
end

Rails 3.1へのアップグレードおよびアセットパイプラインの追加については、 this railscast を参照してください。

Update:Rails 4は以前の方法に戻ります。ありがとうアーロン・グレイ

# Require the gems listed in Gemfile, including any gems
# you've limited to :test, :development, or :production.
Bundler.require(:default, Rails.env)
6
Ryan

application.rbでアセットパイプラインを有効にしましたか?

config.assets.enabled = true

Sassスタイルシートの拡張子を.css.scssに設定することにより、正しく実行しました。それはRails= CSSとしてコンテンツを出力する前にSassで最初にファイルを解析することを知っています。

4
Brandan

/ tmp/cacheをクリアしてみてください。私はRailsとSassにあまりにも新しいので、これがなぜ機能したのかを知ることはできませんでしたが、何時間もの検索の後、私にとって同じ問題を解決しました。

ところで、これは、変数の設定やそれらを使用した計算など、他のSassディレクティブが実行されているのを見ることができたにもかかわらず機能しました。私はそれを追跡する時間があれば、非常に簡単な説明があると確信しています。

1
kburke

@Ryanによって提案された変更と、sass-Railsのアップグレードを行いました。

bundle update sass-Rails

sass 3.2.6は機能しましたが、3.2.5は機能しませんでした。

1
Steve

同じ問題が発生し、Gemfileにスプロケットを明示的に要求することで修正しました(ActionPackの依存関係であっても)。

group :assets do
  gem 'sprockets'
  gem 'sass-Rails', '~> 3.2.3'
  # ...
end

理由はわかりませんが、現在は機能しています。 ;-)

0
iGEL

私はこれに対して何日も頭を叩いてきました。私のために働いた唯一の解決策は次のとおりでした:

  1. Gemfileの:developmentグループに必ずsass-Railsを追加してください。
  2. それでも解決しない場合は、config/initializers /にある「horrible_sass_patch.rb」などの新しいファイルに次を追加します。

    begin
      require 'sass-Rails'
    rescue
    end
    
    if Class.const_defined? "Sass::Script::Functions"
      module Sass::Script::Functions
        # This function exists, but doesn't automatically register
        declare :asset_url, [:value]
        declare :image_url, [:value]
        declare :font_url, [:value]
        # ... etc
      end
    end
    

注:これには、「アクティブな」Bundlerのロードメカニズムを使用する必要があります。つまり、application.rbは次を使用します。

Bundler.require *Rails.groups(:assets => %w(development test))

...そして、スタイルシートがベンダーにある場合、それらがSassの構成に含まれていることを確認してください:

if config.respond_to? :sass
  config.sass.load_paths << Rails.root.join('vendor', 'assets', 'stylesheets')
end
0
user208769