sass-rails幫手「image-url」，「asset-url」在rails中不起作用3.2.1

Question

我在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') 

，當我訪問本地主機：3000/AS套/公/ 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'); 
} 

但得到相同的結果...有沒有人有任何想法爲什麼這些助手不工作？

Answer 1

儘管文檔中提到了什麼，但似乎rails 3.2.6中的默認選項允許您在CSS中使用更少的路徑信息來工作。 例如../app/assets/images/rails.png是你的example.css中的引用。喜歡的東西SCSS文件：

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

你不包括image-url或asset-url到您的SCSS（據我所知），只是普通的url(your_image.png)。這些文檔似乎只是對它在後臺做什麼的解釋。

Answer 2

您是否已啓用資產管道application.rb？

config.assets.enabled = true 

您在您的薩斯樣式表的擴展設置爲.css.scss做得對。這讓Rails知道在用CSS發佈內容之前先用Sass解析文件。

Answer 3

您可能想要嘗試清除/ tmp/cache。我對Rails和Sass太新了，不知道爲什麼這會起作用，但經過幾個小時的搜索後，我解決了同樣的問題。

順便說一句，儘管事實上我可以看到其他的Sass指令，比如設置變量和計算它們，正在執行的事實。我確定有一個非常簡單的解釋，一旦我有時間追蹤它。

Answer 4

當我遇到這個問題時，這是因爲我沒有將css文件包含在資產管道中進行預編譯。因此，它將在運行時生成。由於sass-rails gem通常位於：assets組，因此在運行時生成css文件時幫助器不可用。

嘗試添加下面一行到你的application.rb中（或production.rb）：

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

我發現修復上this post包括圍繞它們添加到預編譯器時，文件命名爲一個疑難雜症。

Answer 5

我們只是有同樣的問題，並通過明確要求在Gemfile中鏈輪（即使它是ActionPack的的依賴）固定它：

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

我不知道爲什麼，但它現在的作品。 ;-)

Answer 6

如果已經更新您的應用程序過去到Rails 3.1，請務必從

# 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) 

改變了你的application.rb中文件

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 

見this railscast上升級到Rails 3.1和添加資產管道。

更新： Rails 4可以回到舊的方式。謝謝Aaron Gray！

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

Answer 7

我提出由@Ryan建議的變化，以及升級青菜護欄：

bundle update sass-rails 

青菜3.2.6爲我工作，而3.2.5沒有。

Answer 8

我一直在抨擊我的頭幾天。對我而言，唯一的解決方案如下：

1. 確保您的Gemfile中的開發組具有sass-rails。

2. 如果不解決這個問題，以下內容添加到在配置/初始化/稱爲像「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 
   

注：這需要你使用「主動」捆紮機加載機制，即你的application.rb中使用下列內容：

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

...如果你的樣式表是供應商，確保他們包含在薩斯的配置：

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

Answer 9

您可以像往常一樣向路徑添加尾隨前斜槓/並使用url。

backgound-image: url("/assets/rails.png")