【问题标题】:Rails 4 - CSS is not being applied in productionRails 4 - CSS 未在生产中应用
【发布时间】:2016-01-02 23:20:49
【问题描述】:

我正在尝试制作一个 rails 4 应用程序。我使用引导程序和 SCSS。

在我的 gem 文件中,我有:

gem 'sass-rails', '~> 5.0'
gem 'bootstrap-sass', '~> 3.3.5.1'
gem 'font-awesome-sass', '~> 4.4.0'
gem 'bootstrap-slider-rails'
gem 'bootstrap-datepicker-rails'
gem 'autoprefixer-rails'

在我的样式表文件夹中,我有几个文件夹,一个叫做 application.css.scss

@import "bootstrap-sprockets";
@import "bootstrap";
@import "font-awesome-sprockets";
@import "font-awesome";
@import "bootstrap-slider";



@import "addresses.scss";
@import "articles.css.scss";
@import "common.css.scss";
@import "footer.css.scss";
@import "forms.css.scss";
@import "glyphs.css.scss";
@import "index.css.scss";
@import "legal.css.scss";
@import "navigation.css.scss";
@import "pages.css.scss";
@import "profiles.scss";
@import "video.css.scss";

在我的articles.css.scss 文件中,我有:

.commentattributiondate {
  font-family: 'Roboto', sans-serif;
  color: grey;
  font-size: 11px;
  text-align:right;
  padding-right: 10%;
  padding-top:1%;
  line-height: 1.5;

}

在我看来,我有:

<div class="commentattributiondate">
                    <%= comment.created_at.try(:strftime, '%e %B %Y') %>
                </div>

在本地主机中,我的文本使用这种样式格式化。

但是,在生产模式下它不是。当我在 google 中检查元素时,我可以看到日期包含在这个 div 标签中,它是最接近属性的 div 标签,但是,当我想在代码检查器中检查样式时,那个 div 标签名称是'根本没有列出。

我以前在按字母顺序高于 application.css.scss 文件的文件中保存样式时遇到问题,但是,文章在应用程序之后并导入到应用程序文件中。

谁能看到我做错了什么?

事实上,我的profiles.css.scss 文件中定义的所有样式也是如此。

【问题讨论】:

  • 你如何“检查谷歌中的元素”? Google 是一个搜索引擎。
  • 嗨 Cimmanon,当您右键单击 html 时,您可以选择检查。这显示了页面上使用的 html
  • @cimmanon 我想他的意思是在浏览器上
  • @user2860931我不是 RAILS 专家,这可能不是你的答案(因此我不提供它作为答案)但你的文件命名不应该是 file.scss 或 _file。 scss 如果它是部分文件?而不是 file.css.scss?
  • 嗨,莲花,它们不是局部的。还是谢谢

标签: css ruby-on-rails twitter-bootstrap sass


【解决方案1】:

这对我有用。我不知道为什么它在推送到 heroku 时不是自动的,但希望它可以帮助其他人:

在 production.rb 中 - 取消注释这一行:

config.assets.css_compressor = :sass

然后:

rake assets:precompile

【讨论】:

    猜你喜欢
    • 2013-09-13
    • 1970-01-01
    • 1970-01-01
    • 2017-06-21
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-07-26
    相关资源
    最近更新 更多