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>

在开发环境中它完美无缺。 但是在生产环境中，此代码不起作用虽然我可以使用浏览器控制台在资产中看到它：

$(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需要系绳＆＃39;工作而不会产生错误。并且因为编译的javascript被压缩到只有一行，所以如果你得到错误，所有的javascript都会停止工作:)

如果你安装Tether，它会更好吗？

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

Answer 2

我建议您启动.js.coffee，如下所示

jQuery ($) ->
   $(document).on "turbolinks:load", ->