Ruby on Rails的引导CSS JS工作，但没有找到

我有我添加了自举宝石Ruby on Rails的引导CSS JS工作，但没有找到

首先我将此两种宝石

gem 'bootstrap' 
gem 'sprockets-rails', :require => 'sprockets/railtie'

里面装了这个包

Using bootstrap 4.0.0.alpha3 
Using sprockets 3.6.0

Rails应用程序

我修改后application.scss至

// Custom bootstrap variables must be set or import before bootstrap itself. 
@import "bootstrap";

后来我就离开application.js这样

// This is a manifest file that'll be compiled into application.js, which will include all the files 
// listed below. 
// 
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts, 
// or any plugin's vendor/assets/javascripts directory can be referenced here using a relative path. 
// 
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the 
// compiled file. 
// 
// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details 
// about supported directives. 
// 
//= require jquery 
//= require jquery_ujs 
//= require turbolinks 
//= require tether 
//= require bootstrap-sprockets 
//= require_tree . 
//= require_self

最后我application.html.erb是这个

<!DOCTYPE html> 
<html> 
<head> 
    <title>Squirm</title> 
    <%= stylesheet_link_tag "bootstrap" %> 
<%= javascript_include_tag "bootstrap" %> 
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %> 
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %> 
<%= csrf_meta_tags %> 
</head> 
<body> 
    <%= render 'partials/navbar' %> 

    <div class="container"> 
    <%= yield %> 
    </div> 

</body> 
</html>

引导似乎我们的工作，但在谷歌浏览器控制台似乎并没有被发现

来源

2016-04-30 agusgambina

您在加载jQuery之前加载Bootstrap。许多Bootstrap的组件需要JavaScript（传送带，标签等），然而，Bootstrap的大部分功能都无法正常工作，这就是Bootstrap CSS显示在您的页面上的原因。

加载引导后jQuery将解决这个问题：

<!DOCTYPE html> 
<html> 
<head> 
    <title>Squirm</title> 

<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %> 
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %> 
<%= stylesheet_link_tag "bootstrap" %> 
<%= javascript_include_tag "bootstrap" %> 
<%= csrf_meta_tags %> 
</head> 
<body> 
    <%= render 'partials/navbar' %> 

    <div class="container"> 
    <%= yield %> 
    </div> 

</body> 
</html>

而且，不是100％确定基于你的代码，但你可能会加载引导两次。看来这行：//= require bootstrap-sprockets已经加载Bootstrap。

来源

2016-04-30 13:29:38

谢谢@AnthonyE我有两个错误，首先是导入顺序，其次是我为项目添加了两次bootstrap。 – agusgambina

你需要添加jquery以及通常jQuery的捆绑在轨应用程序，但可能是由于某种原因它不是THR在你的应用程序

从

https://cdnjs.com/libraries/jquery/

添加 jQuery和我们knwo如果这种变化的作品。

来源

2016-04-30 13:29:20 Apoorv

它看起来像jQuery已被加载在'application.js' –

谢谢你@ user5501253你是对的，jquery是在错误的顺序，这就是为什么bootstrap不会看到它。 – agusgambina

Ruby on Rails的引导CSS JS工作，但没有找到

回答

相关问题