2012-05-06 51 views
3

我正在尝试部署本地工作的Rails 3.1应用程序。但是一旦部署到Heroku(雪松堆栈),我遇到了一个本地没有的问题,我找不到任何解决方案。从Heroku上的父目录导入SCSS文件Cedar

实际上,在我的一些SCSS文件中,我导入了位于父目录中的其他SCSS文件。在几种语法我想:

@import "file.css.scss"; 
@import "file"; 
@import "/file.css.scss"; 
@import "/file"; 
@import "../file.css.scss"; 
@import "../file"; 

大多数这些本地工作,但在我的Heroku雪松的应用程序没有工作。我也尝试用一个下划线将我的导入文件重命名为“_file.css.scss”,因为它似乎是导入SCSS文件的标准格式。但没有改变任何东西。

错误Heroku的日志给我的是: ActionView::Template::Error (File to import not found or unreadable: /mixins.css.scss.

我得到的想法,现在,所以如果你有任何破案线索,这将是感激。

非常感谢, 干杯!

回答

-1

最好的办法是使用内置的Rails Asset Pipeline来处理包含您的样式文件。

在您的app/assets/stylesheets文件夹中,您应该有一个名为application.css的文件。此文件使用Sprockets自动包含放置在app/assets/stylesheets文件夹内的所有css文件。

在文件的顶部,你会看到:

/* 
* This is a manifest file that'll automatically include all the stylesheets available in this directory 
* and any sub-directories. 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_self 
*= require_tree . 
*/ 

*= require_self部分包括写在这个实际application.css文件的任何css样式,而*= require_tree .部分包括app/assets/stylesheets发现的资产。

如果你想改变夹杂物的顺序,或指定一个特定的样式,例如一个名为mixins.css.scss位于app/assets/stylesheets文件,这里是你如何做到这一点:

/* 
* This is a manifest file that'll automatically include all the stylesheets available in this directory 
* and any sub-directories. 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_self 
*= require_tree . 
*= require_mixins 
*/ 

而链轮的魔力将包括你的文件。

+0

感谢您的回答,我甚至没有想到这一点。但实际上,看起来像使用require,资产管道会给我带来麻烦,因为我想要导入的文件中包含mixin和变量,并且在使用Assets Pipeline时不会出现在编译时。因此,我不能在“调用”文件中使用我的变量和mixins(例如获取“未定义的mixin”错误)。一些更多细节在这里:http://dev.af83.com/2011/06/14/2-require-tips-for-rails-3-1-assets-bundling-with-sprockets.html –

+0

你有没有试过要求你的在资产管道设置中的每个文件的顶部混合? – joshferrara

+0

是的,这正是我所尝试的。我得到了“未定义的mixin”错误。 –

0

的语法应该是

用下面的文件夹结构

/app/ 
    /assets/ 
    /stylesheets/ 
     /pages/ 
     index.css.scss 
     products.css.scss 
     application.css.scss 

如果你想包括SCSS文件/网页/从application.css.scss你可以这样做:

@import "pages/index"; 
@import "pages/products"; 

您还应该能够做到以下几点(但我不确定这是否仅限于在项目中使用Compass)。

@import "pages/*"; 

能够执行glob导入是非常棒的。但我认为它可能只是Compass,或者至少它曾经是。

0

如果进口是同一个文件夹中的文件下面应该工作:

@import './file.css.scss'; 

我发现它有相对路径和文件扩展名存在时我遇到了一个类似的问题是很重要的。由于您正在尝试使用../,它会查找您在父文件夹中导入的文件,而不是在同一文件夹中。