本地应用程序和部署到 Heroku 中的区别

Question

我有以下问题，我正在 Rails 上使用物化 CSS 而不是 Bootstrap 开发应用程序；事实是当我需要收取一些 JavaScript 才能看到，例如 "dropdown menu" 或 "select"，在本地版本中它工作正常但是当我部署到 Heroku 时，我需要重新加载页面只是为了看到这个元素。我在 Chrome inspector 中看到了这两个应用程序，我在 "source":

中发现了一些奇怪的东西

本地版本

<head>
  <link href="/assets/application.css?body=1" media="screen" rel="stylesheet" />
  <script src="/assets/jquery.js?body=1"></script>
<script src="/assets/jquery_ujs.js?body=1"></script>
<script src="/assets/materialize/jquery.easing.1.3.js?body=1"></script>
<script src="/assets/materialize/velocity.min.js?body=1"></script>
<script src="/assets/materialize/hammer.min.js?body=1"></script>
<script src="/assets/materialize/jquery.hammer.js?body=1"></script>
<script src="/assets/materialize/collapsible.js?body=1"></script>
<script src="/assets/materialize/dropdown.js?body=1"></script>
<script src="/assets/materialize/leanModal.js?body=1"></script>
<script src="/assets/materialize/materialbox.js?body=1"></script>
<script src="/assets/materialize/parallax.js?body=1"></script>
<script src="/assets/materialize/tabs.js?body=1"></script>
<script src="/assets/materialize/tooltip.js?body=1"></script>
<script src="/assets/materialize/waves.js?body=1"></script>
<script src="/assets/materialize/toasts.js?body=1"></script>
<script src="/assets/materialize/sideNav.js?body=1"></script>
<script src="/assets/materialize/scrollFire.js?body=1"></script>
<script src="/assets/materialize/scrollspy.js?body=1"></script>
<script src="/assets/materialize/forms.js?body=1"></script>
<script src="/assets/materialize/slider.js?body=1"></script>
<script src="/assets/materialize/cards.js?body=1"></script>
<script src="/assets/materialize/pushpin.js?body=1"></script>
<script src="/assets/materialize/animations.js?body=1"></script>
<script src="/assets/materialize/buttons.js?body=1"></script>
<script src="/assets/materialize/transitions.js?body=1"></script>
<script src="/assets/materialize/date_picker/picker.js?body=1"></script>
<script src="/assets/materialize/date_picker/picker.date.js?body=1"></script>
<script src="/assets/materialize-sprockets.js?body=1"></script>
<script src="/assets/owl.carousel.js?body=1"></script>
<script src="/assets/index.js?body=1"></script>
<script src="/assets/jquery-ui.js?body=1"></script>
<script src="/assets/jquery.min.js?body=1"></script>
<script src="/assets/jquery.mmenu.js?body=1"></script>
<script src="/assets/materialize.js?body=1"></script>
<script src="/assets/materialize.min.js?body=1"></script>
<script src="/assets/script.js?body=1"></script>
<script src="/assets/section.js?body=1"></script>
<script src="/assets/shopping_cart.js?body=1"></script>
<script src="/assets/application.js?body=1"></script>
  <meta content="authenticity_token" name="csrf-param" />
<meta content="cmwx+6SEw1CKtoScvCUqgEP77I8PGySQvztPPo3MKgw=" name="csrf-token" />
</head>

Heroku 版本

<head>
  <link href="/assets/application-b804f5fbe6a002a548de7e30161c225b.css" media="screen" rel="stylesheet" />
  <script src="/assets/application-9fe0c4c49ba13eb54f93880ba7ad932e.js"></script>
  <meta content="authenticity_token" name="csrf-param" />
<meta content="j+oWzNXf5+jUhodRLG7+4vPKp9ybgieDaFCZfJCMAXo=" name="csrf-token" />
</head>

我放一些我项目的文件

#application.js 
//= require jquery
//= require jquery_ujs
//= require materialize-sprockets
//= require owl.carousel
//= require_tree .

我这里调用函数

 <script>$(document).ready(function() {
    $('select').material_select();
  });</script>
  <body>
<h3 class="center-align teal-text thin"> Publica un nuevo producto </h3> 
<%= render 'form' %>
</body>

Answer 1

要使您的生产资产与开发资产完全相同，请比较 config/environments/development.rb 和 config/environments/production.rb。将开发中的资产配置行设置为等于生产中的资产配置行。

更好的选择是出于性能原因保持缩小。我建议查看源映射以在生产中进行调试。您可以在此处找到有关使用源映射的很好的介绍：http://code.tutsplus.com/tutorials/javascript-debugging-using-cross-browser-source-maps--cms-24430

本地应用程序和部署到 Heroku 中的区别

Differences between local app and deployed into Heroku

ruby-on-rails

heroku

materialize