使用Bootstrap SASS w / Rails 5没有gem

时间:2018-05-25 15:52:38

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

我对官方TBS宝石没有运气。

相反,我在供应商目录中安装了所有必需的.js和.scss文件。

在我的applications.css.scss中,我有......

@import "bootstrap/scss/bootstrap";
@import "historical-bs-custom";

其他SASS文件也在上面的/ scss目录中。 这些是我认为默认情况下主要由bootstrap.scss中的@import语句加载的组件。防爆。 _alert.scss,_badge.scss等。

在我的application.js中,我有......

//= require rails-ujs
//= require turbolinks
//= require jquery-3.3.1.slim.min
//= require popper.min
//= require bootstrap/bootstrap
//= require_tree . 

在页面的源代码视图中看到.js加载正常,但我的CSS根本没有。

我的gemfile指定它正在使用

gem 'sass-rails', '~> 5.0'

我认为这足以预处理SASS。我还添加了

# Bootsrap sass specific gem
gem 'bootstrap-sass'

但没有运气。

我希望能够为此应用程序使用SASS变量以及自定义CSS规则。互联网上的大多数文档都与宝石的使用有关,我发现我并不是唯一一个遇到麻烦的人。

有没有人试图在没有宝石的情况下做这样的事情? 任何建议或见解将不胜感激。

提前致谢。

1 个答案:

答案 0 :(得分:0)

我能够通过修改代码来预处理SASS,如下所示,使用application.css.scss文件中初始默认注释之外的@import语句。

/*
* 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, 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 other CSS/SCSS
* files in this directory. Styles in this file should be added after the last require_* statement.
* It is generally better to create a new file per style scope.
*
*/
@import "bootstrap/scss/bootstrap";
@import "historical-bs-custom";
@import "test";

首先,当使用VSCode时,语法突出显示错误,所以我退缩了。一个非常好的同事和朋友让我再试一次。现在我可以继续我的生活。