Ruby on rails：资产中的样式表不起作用答案

【问题标题】：Ruby on rails: stylesheet in assets doesn't worksRuby on rails：资产中的样式表不起作用
【发布时间】：2014-05-08 19:27:39
【问题描述】：

我的资产管道一直有问题，即使在阅读http://guides.rubyonrails.org/asset_pipeline.html之后我仍然遇到问题。

当我在开发中加载页面时，我的 css 没有呈现，看起来 css 没有被考虑在内，因为如果我将此 css 放入页面标题中的<script></script> home.html .erb 完美运行。

我在 app/assets/stylesheets/bootstrap.css.scss

中有这个样式表

bootstrap.css.scss

/* BOOSTRAP CSS */
/* /BOOSTRAP CSS */

.form-group {
  width: 250px;
  font-size: 10px;
  opacity: 1;
 } 


.panel {
    width:300px;
    margin-left: auto;
    margin-right: auto;
    opacity: 0.8;
    z-index: 10000;

}

.btn-default {
    border: 1px solid #28c3ab;
    color: #1abc9c;
    background-color: #f1c40f;
}




.jumbotron {
    background-color:#ecf0f1;
    color:#1abc9c;
} 

.btn-default {
    color: #1abc9c;
    background-color: #f1c40f;
}

.btn-default:hover,
.btn-default:focus {
    border: 1px solid #28c3ab;
    outline: 0;
    color: #1abc9c;
    background-color: #3498db;
}


.btn-primary {
    border: 1px solid #28c3ab;
    color: #f1c40f;
    background-color: #1abc9c;
}

.btn-primary:hover,
.btn-default:focus {
    border: 1px solid #28c3ab;
    outline: 0;
    color: #f1c40f;
    background-color: #3498db;
}

这是我在 app/assets/stylesheets/application.css 中的 application.css

/*
 * 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 vendor/assets/stylesheets of plugins, if any, 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 top of the
 * compiled file, but it's generally better to create a new file per style scope.
 *
 *= require_self
 *= require 'masonry/transitions'
 *= require_tree
 *= require font-awesome 
 *= require bootstrap
 *= require magnific-popup
 */

我不确定出了什么问题，我尝试预编译资产，但仍然无法正常工作，我会遗漏什么？

我的布局中有指向我的样式表的链接，app/views/layouts/application.html.erb

    <%= stylesheet_link_tag "application", media: "all" %>
    <%= javascript_include_tag "application" %>
    <%= csrf_meta_tags %>

【问题讨论】：

你的 application.css 是什么样的，这个 bootstrap.css.scss 位于哪里？
@Iceman，我刚刚用你的要求编辑了我的问题！
我认为您的 *= require_tree 上缺少一个句号 - 我很确定它应该是 *= require_tree .
是的库尔特，我错过了 *= require_tree 之后的时间段。但它并没有成功，它仍然无法正常工作:)

标签： css ruby-on-rails asset-pipeline assets

【解决方案1】：

当您为生产预编译资产时，请确保您的开发环境未同时使用这些资产。所以检查你的 html 并确保你可以看到每个 css 文件，而不仅仅是 application.css

如果您发现您使用的是预编译资产，请运行 rake assets:clean，然后您的开发环境将使用正确的 css 文件。

【讨论】：

这真的很奇怪，因为看起来我的样式表都没有工作，我必须将 css 放入标题中才能使其工作......
好吧，我遇到了问题，我把@import bootstrap 放在另一个样式表中，所以我的css bootstrap 没有被考虑在内，看起来只有一个样式表必须使用import bootstrap ！谢谢你的帮助

【解决方案2】：

我的样式表没有加载时遇到了类似的问题。但这是因为我有改变 <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>

一行代码

<%= stylesheet_link_tag 'default', media: 'all', 'data-turbolinks-track': 'reload' %>

在构建我的应用程序的早期阶段的 application.html.erb 文件中......但我把它改回了

<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %> 加载的样式表。

application.html.erb 位于 rails 应用程序目录的 view/layout/ 文件夹中。

【讨论】：