6

我想将我的 application.css 文件更改为 sass 文件并使用 @import 拉取所有必要的文件。然后我想将 application.css.sass @import 到页面特定的 sass 文件中。这一切在开发中都运行良好,但是当我将它推送到 heroku 上的生产环境时,我得到了这个错误:

Error compiling CSS asset
Sass::SyntaxError:  File to import not found or unreadable: application

应用程序.css.sass:

@import "reset"
@import "typography"
@import "buttons"
@import "junk"

$yellow: #f0f090
$orange: #f89818
$blue1: #184898
$blue2: #4888c8

body
 background: ...
 ...
 /* all the rest of the app-wide styling */

uniquePage.css.sass:

@import "application"
/*page specific styling*/

然后在需要与 application.css 不同的东西的页面上,我调用

!!! 5
%html
  %header       
    = stylesheet_link_tag "uniquePage"
4

3 回答 3

5

在 Rails 3.1 中,application.css旨在用作清单文件。您不应该重命名它,也不应该在其中放置内容,除了 require 或 include 指令。

为您的目的使用不同的文件名。

另请注意,SCSS @import 语法就像使用部分语法一样。如果要@import application导入的文件应该被调用_application,而不是application

于 2011-10-13T08:33:48.463 回答
5

您应该将其更改为 application.scss :)

请检查这两个 RailsCast:

http://railscasts.com/episodes/279-understanding-the-asset-pipeline

http://railscasts.com/episodes/282-upgrading-to-rails-3-1

对 Simone 的建议 +1

于 2011-10-13T08:42:07.963 回答
3

那么我想问题就变成了,我如何为不同的 css 集制作不同的清单文件?

做这件事有很多种方法:

1. 每页纸

这就是您现在正在做的事情,但我会稍微不同地组织工作表,在应用程序和唯一页面中使用 @imports。(而不是将应用程序导入唯一页面)。

2. 只为这些页面使用第二张纸

您可以拥有仅包含该页面更改的第二张工作表。所有页面都有申请表,并且在唯一页面上添加了第二个标签,仅进行了所需的更改。这会花费您额外的 http 请求。

3. 重新组织你的 CSS

除非额外的 CSS 很大,否则最好重构以将代码包含在主文件中。很容易向唯一页面的主体标签添加一个额外的类,并调整任何 CSS 以供页面使用。

您仍然可以将该 CSS 放入唯一页面的文件中(以帮助维护),然后将其 @import 到您的主文件中。

作为一般规则,除非 CSS 更改很大,否则我会尝试将它们合并到主 CSS 中,否则选择选项 1。

于 2011-10-13T17:47:35.713 回答