預編譯用於css填充的scss文件

Question

我正在嘗試使用html填充來包含IE特定的樣式表。但是，繼續運行到「ActionView :: Template :: Error（即/ IE9.css未預編譯）：」錯誤一旦部署到heroku。它似乎在本地工作。

我一直在嘗試資產的不同組合和位置，但到目前爲止沒有任何工作。

我目前的配置如下。

的IE特定文件位於：

app/assets/stylesheets/ie/index.css.scss 
app/assets/stylesheets/ie/IE9.css.scss 
app/assets/stylesheets/ie/IE8.css.scss 
app/assets/stylesheets/ie/IE7.css.scss 
app/assets/stylesheets/ie/IE6.css.scss 

index.css.scss

/* 
*= require_tree . 
*/ 

application.html.haml

/[if gte IE 9] 
    = stylesheet_link_tag "ie/IE9", media: "all" 

application.css.scss

/* 
* This is a manifest file that'll be compiled into application.css, which will include all the files 
* listed below. 
* 
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets, 
* or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path. 
* 
* You're free to add application-wide styles to this file and they'll appear at the top of the 
* compiled file, but it's generally better to create a new file per style scope. 
* 
*= require bootstrap 
*= require baseline 
*= require base10creations/gallery_required 
*= require ie 
*= require_self 

*/ 

@import 'baseline.css.scss'; 
@import 'rem.css.scss'; 
@import 'common.css.scss'; 
@import 'admin.css.scss'; 
@import 'layout.css.scss'; 
@import 'pages.css.scss'; 
@import 'components.css.scss'; 
@import 'forms.css.scss'; 
@import 'override.css.scss'; 

Answer 1

最後我只使用一個鏈接標籤，而不是軌stylesheet_link_tag獲得。雖然我不知道爲什麼stylesheet_link_tag正在拋出一個合適的。

工作文件是：

目錄結構

app/assets/stylesheets/ie/index.css.scss 
app/assets/stylesheets/ie/IE9.css.scss 
app/assets/stylesheets/ie/IE8.css.scss 
app/assets/stylesheets/ie/IE7.css.scss 
app/assets/stylesheets/ie/IE6.css.scss 

index.css.scss

/* 
*= require_tree . 
*/ 

application.html.haml

!!! 
%html 
    %head 
    %meta{:charset => "UTF-8"}/ 
    %title= "Title" 
    = stylesheet_link_tag "application", media: "all" 
    = javascript_include_tag "application" 
    = csrf_meta_tags 
    /[if lt IE 9] 
     %script{ src: "http://html5shim.googlecode.com/svn/trunk/html5.js", type: "text/javascript" } 
    /[if gte IE 9] 
     %link{ href: "ie/IE9.css" } 
    %body 
    #container 
     = render :partial => "layouts/header" 
     #content 
     #messages 
      - flash.each do |name, msg| 
      = content_tag :div, msg, :id => "flash_#{name}" 
     = yield 
     = render :partial => "layouts/footer" 

application.css。SCSS

/* 
* This is a manifest file that'll be compiled into application.css, which will include all the files 
* listed below. 
* 
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets, 
* or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path. 
* 
* You're free to add application-wide styles to this file and they'll appear at the top of the 
* compiled file, but it's generally better to create a new file per style scope. 
* 
*= require bootstrap 
*= require baseline 
*= require base10creations/gallery_required 
*= require ie 
*= require_self 

*/ 

@import 'baseline.css.scss'; 
@import 'rem.css.scss'; 
@import 'common.css.scss'; 
@import 'admin.css.scss'; 
@import 'layout.css.scss'; 
@import 'pages.css.scss'; 
@import 'components.css.scss'; 
@import 'forms.css.scss'; 
@import 'override.css.scss'; 

Answer 2

有一對夫婦在你的情況選擇：

• 在application.css加

  ：

  * = require_tree。

• 使用index file technique，它只是需要一個新的「索引」的文件在你的ie/目錄中的內容相同（*= require_tree .）;

我建議刪除

config.assets.precompile += ["IE9.css", "IE8.css", "IE7.css", "IE6.css"] 

從 production.rb

和旅遊佈局文件application.html.haml到IE墊片的條件調用。

編輯：IE瀏覽器更好的JS：

/[if lt IE 9] 
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js" type="text/javascript"></script>