正確的方式來要求Rails中的Sass依賴關係

我在我的Rails項目中使用Zurb基金會，並且在我的項目中包含基礎scss文件時遇到困難。我希望能夠在不同的scss文件中使用foundation_and_overrides的變量，但是如果我在每個scss文件中都需要使用@import這個文件，那麼看起來基礎會在我的項目中多次包含。正確的方式來要求Rails中的Sass依賴關係

我的樣式表結構如下：

application.css.css：

/* 
*= require_self 
*= require pages 
*/ 

@import "foundation_and_overrides";

pages.css.css：

@import "foundation_and_overrides";

的問題是，如果我不要導入foundation_and_overrides在pages.css.scss我將無法使用基礎predef ned變量，例如$primary-color。

問題是：我應該如何正確使用require或sass導入函數，以便Rails只編譯一次基礎，並且我將能夠在所有scss文件中使用基礎變量？

來源

2014-10-04 Aljaz

基礎生成器實際上爲您創建了foundation_and_overrides文件，因此您可以根據需要修改它，並在「application.css.scss」中將其導入一次。 – Achrome 2014-10-04 17:18:31

我們可以爲這個問題想出一個更好的標題嗎？最好的我能想出的是「用Rails導入Sass文件而不重複代碼」，但我不確定是否準確地描述了問題。 – cimmanon 2014-10-05 00:55:16

的訣竅是在根級別使用，而不是使用require@import指令。 @import指令由SCSS處理器控制，因此一切應該在任何SCSS文件中使用。例如：

# app/assets/stylesheets/application.css.scss 

@import "defines"; 
@import "foundation_and_overrides"; 

@import "base"; 
@import "forms";

你可以把你想成爲全球任何變量/混合式定義爲您的應用在defines.css.scss文件，然後如果你願意foundation_and_overrides.css.scss使用這些喜歡。否則，在foundation_and_overrides.css.scss（以源代碼/行順序）之後定義的任何文件現在都可以訪問所有基礎變量（以及您自己定義的）。

來源

2014-10-04 18:33:16 pdobb

謝謝。對所有依賴項使用@import而不是require是否是一種好習慣？還是應該在某些情況下使用它？ – Aljaz 2014-10-04 18:40:08

我在所有情況下都使用它。我不知道會有什麼不好的原因。 – pdobb 2014-10-04 18:40:54

對不起碼列入打破對SO（這樣的代碼似乎有點怪異）

我所有的應用程序

不重命名application.css到application.scss方式（與同爲應用.js文件不重命名爲application.coffee）
對於SCSS文件由
然後要求目錄遞歸創建目錄：

# application.css 
*/ 
*= require_tree ./directory_name 
*/

# application.js 

#= require_tree ./directory_name

4. TwitterBootstrap/ZurbFondation在創建 shared/bootstrap-init.scssinclude @import 'bootstrap';文件了。 5.然後需要在清單文件中的文件：

# application.css 
*/ 
*= require_tree ./shared 
*/

來源

2014-10-04 17:33:35 itsnikolay

正確的方式來要求Rails中的Sass依賴關係

回答

相關問題