javascript - Rails 5 编译的 js 代码仅适用于生产环境

Question

我有一个 js 代码，它应该向具有类的元素内的所有图像添加一个类:

$(document).on('turbolinks:load', function() {
  $('.blog-article img').addClass('img-fluid');
});

查看它应该在哪里工作，如下所示:

<div class="blog-article">
  <p><img src="http://image_address..." alt=""></p>
</div>

在开发环境中它运行完美。 但在生产环境中，此代码不起作用，尽管我可以使用浏览器控制台在 Assets 中看到它:

$(document).on("turbolinks:load",function(){$(".blog-article img").addClass("img-fluid")});

有什么想法吗？谢谢!

PS。 application.js 文件:

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

$(document).on('turbolinks:load', function() {
    $('.blog-article img').addClass('img-fluid');
});

PPS。有趣的时刻 - 当我在生产中的控制台中看到时，js 代码如下所示:

并且它有多余的空格，所以这可能是导致的原因。但是当我重命名 slass 并将 - 替换为 _ 或删除它或仅保留 .article 时，它​​在生产中仍然有额外的空格:

.blog-      article
.blog_      article
.blog       article
.      article

我的开发过程中一切都是正确的(如上所述)。

有趣的是 - 如果我从控制台复制代码，这些“额外空格”就会消失。

Answer 1

我发现您正在使用 Bootstrap 。 Bootstrap 4 需要“tether”才能工作而不产生错误。而且由于编译后的 javascript 被压缩为仅一行，因此如果出现错误，所有 javascript 都会停止工作:)

如果安装 Tether 效果会更好吗？

https://github.com/twbs/bootstrap-rubygem/blob/master/README.md#installation