導軌引擎和資產

Question

我有一個帶有小部件的Rails引擎。 我正在使用layout: false渲染小部件layout: false render中的layout: false屬性並為小部件設置樣式，我在主應用程序中回收CSS。

現在這是棘手的部分，我的小部件只需要3個樣式表，其中2個在我的主應用程序中，分別是bootstrap.css和_ss_font.css。 在開發中，它工作正常，但是當我將其投入生產時，bootstrap.css出現錯誤，似乎它依賴於供應商資產上的另一個文件。 如何包括這些資產？

注意：如果我使用=stylesheet_link_tag "application"我的問題已部分解決，但我必須處理沖突的類名，並且它將包括我的應用程序中的所有資產。 我只想加載必要的樣式表以在引擎中設置我的小部件的樣式。

編輯1

如建議的那樣，我對此進行了更具描述性的解釋：

所以這是我的錯誤。

ActionView :: Template :: Error（找不到要導入的文件或不可讀的文件：ss變量。加載路徑：/ data / serviceseeking_au_staging / releases / 20140604114806（在/ data / serviceseeking_au_staging / releases / 20140604114806 / vendor / assets / stylesheets / bootstrap中。 SCSS））：

 2: !!! 5 3: %html 4: %head 5: = stylesheet_link_tag "bootstrap", "_ss_font", "feedback/reviews-widget" 6: 7: %body 8: .reviews-container lib/action_logger.rb:31:in `call' 

該視圖在引擎內部。 如您所見，這是我的理想目標，只包含3個樣式表。 reviews-widget沒什么可看的，它只是sass，沒有任何外部文件依賴性，因此我將不顯示它。 因此，查看錯誤消息，此“ ss變量”在哪里？ 好吧，在我們到達那里之前，讓我先帶你們進行實地考察。

我首先跟蹤了bootstrap.scss所在的位置，發現它位於vendor/assets/stylesheets文件夾下的主應用程序中。 其內容如下：

 @import "bootstrap/variables";
 @import "bootstrap/mixins";

 @import "bootstrap/scaffolding";

 @import "bootstrap/grid"; 
 @import "bootstrap/layouts";

 etcetera...

因此，通過跟蹤boostrap.scss並打開它，我看到它正在導入一個名為_variables.scss的局部文件，以此類推， _variable.scss是_variable.scss

@import "ss-variables";

// Grays
// -------------------------
$black:                 #000 !default;
$grayDarker:            #222 !default;

（ 注意 ：我在/vendor/assets/stylesheets/bootstrap內看到了另一個_variables.ss所在的boostrap.scss）啊哈！ 有點怪胎，“ SS變量”！ 我們正在接近這個瘋狂的局部追逐。 因此，我搜索了ss-variables.scss所在的位置，並在主應用程序的lib/assets/stylesheets/中找到了它，它包含更多的scss變量。

因此，為了追蹤它們，我提出了這個假設，即當嘗試在引擎上使用stylesheet_link_tag包含bootstrap時，引擎看不到主應用程序上的從屬文件。

獎勵：我有一種非凡的感覺，在此之后， _ss_font css將是下一個。 但這是另一個故事。 謝謝。

Answer 1

從外觀asset_fingerprinting ，您的問題可能是由資產管道的asset_fingerprinting功能引起的-基本是在所有production資產后附加MD5哈希

-

資產指紋

本質上，如果您使用的是Heroku （需要對其進行預編譯才能提供這些文件），則基本上可以在public/assets文件夾中獲得一系列文件，如下所示：

|-public
|--assets
|---images
|---stylesheets
|---javascripts

預編譯時，此文件夾中包含的文件均具有fingerprinted文件名。 這意味着，如果您要調用其中之一，則需要使用ERB / SCSS預處理器之一來訪問它們：

#app/assets/stylesheets/application.css.scss
.style {
   background: asset_url("background.png");
}

這將引用該文件，而不管它是否已預編譯（和fingerprinted ）。 盡管這不是您的問題，但這是您要問的一個重要因素

-

固定

我建議您的問題很可能是您引用的“靜態” CSS文件，實際上確實需要動態引用。

如何包括這些資產？

這樣最好使用@import ：

#gem/app/assets/gem/widget.css.scss
@import "bootstrap.css" /* will probably need a relative path for this */
@import "other.css" /* again, will need a relative path */