Question

我试图以（http://www.mattboldt.com/organizing-css-and-sass-rails/）中描述的方式在我的应用程序中使用Rails资产管道，但我注意到一些奇怪的行为，我认为这导致我的样式无法应用。

我的资产目录的结构是这样的：

+-- assets
    +--- images
    +--- javascripts
    +--- stylesheets
        +--- styles
            - global.scss
            - scaffolds.scss
        - application.css
        - main.scss

我已经设置了我的application.css文件，只需要自己和同一个app / assets / stylesheets目录中的main.scss文件：

*= require_self
*= require main

此main.scss文件包含我要导入的所有其他文件：

@import "bootstrap-sprockets";
@import "bootstrap";
@import "styles/global.scss";
@import "styles/scaffolds.scss";

但是，当我尝试在浏览器中查看项目时，似乎没有应用我的样式。我注意到的一件奇怪的事情是我的浏览器显示它正在下载application-self-<hash>.css文件和main-self-<hash>.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 any plugin's vendor/assets/stylesheets directory 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 bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any styles
 * defined in the other CSS/SCSS files in this directory. It is generally better to create a new
 * file per style scope.
 *


 */

main-self-<hash>.css文件包含我从其他文件导入的所有自定义CSS。我的印象是它应该实际编译到application.css文件中，而不是编译成css并在其自己的文件中提供。无论如何，这种效果很明显 - 我的风格并没有被应用。我不确定在哪里解决这个问题。任何人都可以帮我指出正确的方向吗？

[编辑]看起来外部来源（来自URL）CSS文件确实被正确编译，并且应用了它们的样式。例如，我将@import url('http://www.w3schools.com/lib/w3.css');添加到我的main.scss文件中，并通过将一个CSS文件类应用于我的div个元素之一来使用它。风格已经应用。

Answer 1

在开发模式下，资产（css，js）将按原样呈现在单独的文件中。

运行

时，它们会在生产模式下合并为一个文件

rake assets:precompile

您可以在开发人员工具中查看浏览器“请求”和“来源”，以确定是否正在加载文件。

Answer 2

我不知道它是否解决了整个问题，但我确实知道application.css应该被命名为application.css.erb或者要求不起作用。

来自Rails spec

“资产管道自动评估ERB。这意味着如果您添加 CSS资产的erb扩展（例如，application.css.erb），然后CSS规则中提供了像asset_path这样的助手：

关于资产的说明

由于所有编译资产都是从/ public / assets /提供的，因此在样式表下的源代码树中添加子目录结构仅用于在代码中添加可能失败的点。

Rails应用程序提供application.css中所需的.scss文件，这是空白的

2 个答案: