导航栏下拉需要引导和引导链轮需要在生产中工作答案

【问题标题】：Navbar dropdown needs bootstrap and bootstrap-sprockets requires to work in production导航栏下拉需要引导和引导链轮需要在生产中工作
【发布时间】：2017-09-09 21:52:18
【问题描述】：

我在 rails 5 应用程序中使用已安装的 bootstrap gem (alpha-v6)。我的导航栏中有一个下拉菜单，它的实现与documentation 中的示例完全相同。

但它目前仅在生产或开发中工作，具体取决于我在 application.js 中的要求：

开发中的作品：

//= require jquery
//= require tether
//= require bootstrap-sprockets
//= require jquery_ujs
//= require turbolinks
//= require_tree .

在生产中工作：

//= require jquery
//= require tether
//= require bootstrap
//= require bootstrap-sprockets
//= require jquery_ujs
//= require turbolinks
//= require_tree .

我知道文档说您不应该同时要求 bootstrap 和 bootstrap-sprockets。但到目前为止，我找不到另一种方法让它在生产中工作。

我错过了什么？

【问题讨论】：

也许还值得注意：仅使用 bootstrap 而不是 bootstrap-sprockets 在开发中根本不起作用。

标签： ruby-on-rails twitter-bootstrap ruby-on-rails-5 twitter-bootstrap-4

【解决方案1】：

首先，我强烈建议您使用bootstrap-sass gem，这样您就可以利用引导程序的 sass 变量、类、mixin 等。在我看来，与您的 Rails 应用程序集成也更容易一些，如果您想要像以前的引导 gem 一样使用它，那么你也可以这样做。我使用bootstrap-sass gem 为您提供答案。

根据bootstrap gem documentation，您不应同时包含引导链轮和引导链轮。

根据文档：

bootstrap-sprockets 提供单独的 Bootstrap Javascript 文件（例如，alert.js 或 dropdown.js），而 bootstrap 提供包含所有 Bootstrap Javascript 的串联文件。

所以要正确包含引导程序的 JavaScript 功能：

//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require turbolinks 
//= require_tree

另外，这假设您使用的是 gem bootstrap-sass

【讨论】：

我知道不要同时使用引导程序和引导链轮，正如我在问题中提到的那样。而且我没有使用 bootstrap-saas。我正在使用新的引导 gem，请参阅我的问题中 gem 的链接。
请参阅 bootstrap-saas gem 的自述文件中的第二行：我正在使用 bootstrap 4，并且为此使用了正确的 gem。 bootstrap-saas 将不支持 bootstrap 4。
明白了。无论如何，在您的 gemfile.lock 中，您的 sprockets-rails 版本是什么？
sprockets-rails 在 3.2.0
只是在黑暗中拍摄，但尝试在 jquery 之后和其他任何东西之前立即要求 jquery_ujs

【解决方案2】：

我目前通过每次 turbolinks 重新加载页面时显式调用下拉函数来工作。

//= require jquery
//= require jquery_ujs
//= require tether
//= require bootstrap
//= require turbolinks
//= require_tree .

$( document ).on('turbolinks:load', function() {
  $('.dropdown-toggle').dropdown();
})

但我不应该这样做，所以我真的很想得到这个问题的真正答案。

【讨论】：