使用twitter Bootstrap rails gem的Bootstrap覆盖不起作用



我正试图根据文件中的说明重写bootstrap_and_overrides.css.less文件中的变量。我知道文件被解析了,因为如果我引入语法错误,应用程序将不会加载,而是设置更少的变量,例如

@navbar-default-color: red;

没有任何效果。这是我的申请。css:

/*
 *= require_tree .
 *= require_self
 *= require rails_bootstrap_forms
 *= require bootstrap_and_overrides
 */

摘录自gemfile:

source 'https://rubygems.org'
ruby '2.0.0'
gem 'rails', '4.1.4'
gem 'sass-rails', '~> 4.0.3'
gem 'uglifier', '>= 1.3.0'
gem 'coffee-rails', '~> 4.0.0'
gem 'jquery-rails'
gem 'turbolinks'
gem 'jbuilder', '~> 2.0'
gem 'sdoc', '~> 0.4.0',          group: :doc
gem 'spring',        group: :development
gem 'bootstrap-sass'
gem 'high_voltage'
gem "therubyracer"
gem "less-rails"
gem "twitter-bootstrap-rails"
gem "bootstrap_form"

这是我的bootstrap_and_overrides.css.less文件:

@import "twitter/bootstrap/bootstrap";
@iconSpritePath: image-url("twitter/bootstrap/glyphicons-halflings.png");
@iconWhiteSpritePath: image-url("twitter/bootstrap/glyphicons-halflings-white.png");
@fontAwesomeEotPath: font-url("fontawesome-webfont.eot");
@fontAwesomeEotPath_iefix: font-url("fontawesome-webfont.eot?#iefix");
@fontAwesomeWoffPath: font-url("fontawesome-webfont.woff");
@fontAwesomeTtfPath: font-url("fontawesome-webfont.ttf");
@fontAwesomeSvgPath: font-url("fontawesome-webfont.svg#fontawesomeregular");
@import "fontawesome/font-awesome";
@import "twitter/bootstrap/glyphicons.less";
// Your custom LESS stylesheets goes here
// If you'd like to override bootstrap's own variables, you can do so here as well
// See http://twitter.github.com/bootstrap/customize.html#variables for their names and 
@navbar-default-color: red;
@navbar-height: 1000px;
@navbar-default-color: red;

在一个可能相关的问题中,我无法在我的html中包含字形图标。

编辑:当我预编译并推送到生产(heroku)时,在生产中解释的变量更少。看来这可能是一个发展问题。

问题出在我的development.rb文件上。我可以通过设置以下变量来修复它:

  config.assets.debug = false

要求树在application.css文件中始终位于最后

/*
 *= require_self
 *= require rails_bootstrap_forms
 *= require bootstrap_and_overrides
 *= require_tree .
 */

最新更新