[英]Javascript randomly not loading on Ruby on Rails 5.2.3 Production Mode
我仍然是 Ruby on Rails 的新手。 這個框架對我來說真的很棒。 但是,自從我將其上傳到生產中后,我仍然不明白為什么Ruby on Rails 5.2.3 在某些隨機情況下無法正確加載JavaScript。 有時它在第一次嘗試打開頁面時正確加載,但如果沒有,用戶有時甚至必須刷新幾次,直到它正確加載。 我也從瀏覽器那里收到錯誤消息
GET .../assets/jquery-ui-1.8.16.custom.css net::ERR_ABORTED 500
當我沒有以任何方式導入甚至編寫一行代碼來導入該文件時,因為我使用了從 CDN 加載的 JQuery UI 1.12.1。
真正重要的是,為什么 Ruby on Rails 5.2.3 在某些隨機情況下無法正確加載 JavaScript?
它不僅發生在生產模式上,而且在開發模式下,這個問題也會在隨機情況下發生。
我將發布 application.js 和 application.scss 以及 application.html.erb 的頭部部分,以了解我在這種情況下做錯了什么:
應用程序.js
//= require jquery3
//= require jquery-ui/core
//= require jquery-ui/widgets/slider
//= require rails-ujs
//= require popper
//= require cocoon
//= require social-share-button
//= require social-share-button/wechat
//= require rippleria/js/jquery.rippleria.min
//= require_tree .
應用程序.scss
/*
*= require gmaps-auto-complete
*= require social-share-button
*= require jquery-ui/core
*= require jquery-ui/slider
*/
@import "pretty-checkbox/dist/pretty-checkbox";
@import "rippleria/css/jquery.rippleria";
應用程序.html.erb
<%= stylesheet_link_tag 'application', media: 'all' %>
<%= stylesheet_link_tag 'sub/style' %>
<%= stylesheet_link_tag 'sub/components.min' %>
<%= stylesheet_link_tag 'sub/custom' %>
<%= stylesheet_link_tag 'sub/chat.min' %>
<%= javascript_include_tag 'application', async: Rails.env.production? %>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui-touch-punch/0.2.3/jquery.ui.touch-punch.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/galleria/1.5.7/galleria.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/flatpickr/4.6.3/flatpickr.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.10/js/select2.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/2.1.2/sweetalert.min.js"></script>
如果你們能讓我知道我可以采取哪些解決方案來避免這種隨機行為,我將不勝感激? 非常感謝您的寶貴時間。 :)
沒關系,我已經解決了這個問題。 Ruby on Rails 的主要問題是,如果我們通過下面編寫的依賴項使用 Rails 5.2.3 提供的 JQuery
gem 'jquery-rails'
它將使用以下行生成應用程序 CSS 文件
@import 'jquery-ui.1.8.6.custom.css'
盡管assets文件夾沒有上面寫的文件,但不由自主地導入了JQuery UI自定義CSS
解決方案:
我建議您反對使用 Rails 5.2.3 提供的 JQuery,並使用 CDN 方法更改 JQuery 以獲得最佳性能。 所以你可以刪除application.js上的以下行
//= require jquery3
然后在application.html.erb上的application.js之前加載 JQuery 的順序,如下所示:
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<%= javascript_include_tag 'application', async: Rails.env.production?, :cache => 'cached/all' %>
希望我的解決方案能有所幫助。 :)
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.