Bootstrap v4 在 Rails 中安装问题

Question

或者他们是？当我在任何引导组件上使用检查元素时，它会从 application.css （而不是引导本身）中获取 CSS。我很确定我在安装时做错了什么，即使我已经看过几次指南。

忘记添加我正在使用 Rails 4.2.6 并使用来自以下位置的 gem： https://github.com/twbs/bootstrap-rubygem#a-ruby-on-rails

这就是我的意思，例如 btn 类正在工作，但它们在检查元素中并不指向 Bootstrap，而是指向 application.css。导航栏（从 getbootstrap.com 复制粘贴）也适用于 javascript 下拉菜单，但 CSS 已关闭。

宝石文件

#Bootstrap V4 Alpha
gem 'bootstrap', '~> 4.0.0.alpha6'
* sprockets-rails (3.2.0)

应用程序.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.
 *
 */

 @import "bootstrap";

应用程序.js

// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details
// about supported directives.
//
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require_tree .
//= require bootstrap

Answer 1

在您的application.js 文件中//= require bootstrap 在//= require jquery 之后，因此文件将如下所示：

// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details
// about supported directives.
//
//= require jquery
//= require bootstrap
//= require jquery_ujs
//= require turbolinks
//= require_tree .

重启你的rails server，修改就会生效。

Answer 2

仔细查看 application.css 文件的 cmets。

 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.

这就是为什么它看起来好像所有的 css 都来自 application.css，但是你正在导入文件底部的引导 css..