Question

自从我在Rails中开发以来，我已经有一段时间了，而且我无法让任何scss样式表在我刚创建的rails应用程序上运行。

layouts/application.html.erb在顶部有默认的<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>。

出于测试目的，我在main.scss中创建了一个assets/stylesheets/文件，如下所示：

* {
border: 1px solid black;
}

我认为application.scss文件应该抓取其文件夹和子文件夹中的所有样式表，但事实并非如此。（奇怪的是，.js文件加载得很好。）

我已经尝试RAILS_ENV=production rake assets:precompile但它没有做任何事情。有人可以解释它甚至做了什么吗？

我已尝试将*= require main和*= require main.scss添加到application.scss。我甚至将文件ext更改为两个文件的css。我获得任何CSS呈现的唯一方法是直接将代码添加到application.scss，这是我不想做的。

请帮助我。

编辑1

我要添加更多信息，因为我获得了通用答案。我提到它是一个新的rails应用程序，所以基本的东西已经预先生成了。这就是我的application.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.
 *
 *= require_tree .
 *= require main
 *= require_self
 */

仍然没有任何作用

Answer 1

 /*
 *= require_tree .
 *= require_self
 */

将以上内容添加到application.scss或application.css.scss文件中

Answer 2

in your application.css, try adding 
    *= require main
    *= require_self

hope this helps

Answer 3

看起来我能让它发挥作用的唯一方法是将@import main;添加到application.scss。看起来样式最终会在每个页面上使用（这是rails中的默认值吗？）。

这不是我理想的解决方案，但这是我唯一能够通过要求方法让任何样式工作的方法。

Answer 4

我无法得到上述工作的答案，但我认为我找到了一个简单的解决办法，使Rails的行为符合预期。

在HEAD部分添加

<%= stylesheet_link_tag    params["controller"], media: 'screen' %>

现在app / assets / stylesheets /中的css / SASS / Scss文件将加载。

可悲的是，你仍然需要预先准备好事情。 GRR。

Answer 5

我认为application.scss文件应该抓住所有的样式表在它的文件夹和子文件夹中，但事实并非如此。（奇怪的是， .js文件加载就好了。）

通过向application.scss添加*= require_tree .，我认为它应该像您期望的那样以递归方式加载所有文件。

Answer 6

使用Rails 4时

确保您的Gemfile使用sass-rails gem

# Use SCSS for stylesheets
gem 'sass-rails', '~> 5.0'

你已经创建了app / assets / stylesheets / main.scss，太棒了！

现在更新application.scss以包含它：

@import "main";

您还需要以这种方式包含各种gem样式表：

@import "bootstrap";

你不应该有一个application.css文件 - 如果你有一个，请删除它。

以递归方式包含样式表是一种不好的做法，因为顺序很重要，而冲突的样式将级联，从而相互冲突。我对你的递归问题没有答案，因为自升级到Rails 4以来我不是这样做的

Answer 7

对我来说这就是解决方案是将css文件链接到您的根目录另外，请确保您的application.html.erb包含以下行：

<%= stylesheet_link_tag 'application', media: 'all' %>

我的rails样式表没有加载/工作

编辑1

7 个答案: