KiwenLau同學在他的個人博客使用了Fundebug的JavaScript錯誤監控插件，然后偶爾會收到jQuery is not defined這樣的錯誤報警:
他的博客使用了Staticfile CDN提供的的jQuery:
<script src="https://cdn.staticfile.org/jquery/3.1.1/jquery.min.js"></script>由出錯的代碼塊可知，博客中的『返回頂部』的功能是使用了jQuery實現，如果jQuery出錯，意味着該功能失效，那么讀者就不得不手動滑動到博客頂部，這樣用戶體驗是非常糟糕的。根據統計，3個月時間內，這個錯誤已經累計出現了399次，已經相當嚴重了。
而根據最新統計數據顯示，jQuery依然是前端用得最多的JavaScript庫，因此一旦jQuery出錯，必定會影響很多功能，jQuery的重要性不言而喻。另一方面，不少Fundebug的用戶都收到過"jQuery is not defined"的錯誤報警，許多前端開發者應該都遇到(也許只是你沒有發現)，我們通過這篇博客幫助大家解決問題。
出錯原因1: 加載CDN的jQuery失敗或者超時
當提供jQuery的CDN出問題導致jQuery加載失敗，或者由於網絡問題瀏覽器加載jQuery文件超時，會出現jQuery未定義的錯誤。
解決方案: 將jQuery文件掛載在自己的網站上作為備用，如果CDN加載jQuery失敗，則使用自己網站存托管的jQuery。這樣的話，大部分用戶依然可以通過CDN加快訪問速度，而一旦CDN出問題時也可以避免出錯。
<script src="https://cdn.staticfile.org/jquery/3.1.1/jquery.min.js"></script> <script>KiwenLau的博客讀者絕大部分來自國內，然而分析錯誤的IP地址后，他發現高達26.1%出錯用戶的來自國外。根據幸存者偏差，我們不能認定國內用戶出錯概率更高，而應該認定國外用戶出錯概率更高。那么這就不難理解了，國外用戶請求國內CDN時速度太慢，導致jQuery出錯。
因此，他將jQuery掛載在http://kiwenlau.com/js/jquery.min.js作為備用，解決了問題。
出錯原因2: 加載jQuery的順序錯誤
依賴於jQuery的其它JavaScript腳本先於jQuery加載完成並執行。這時jQuery尚未加載，因此依賴於jQuery的代碼調用jQuery的話就會出錯。
解決方案: 將jQuery庫放在依賴於jQuery的JavaScript腳本之前，並且將這些代碼放入document.ready來確保DOM加載完畢。
<script type="text/javascript" src="path/to/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function() { //依賴於jQuery的代碼 }); </script>關於Fundebug
https://www.fundebug.com/專注於JavaScript、微信小程序、微信小游戲、支付寶小程序、React Native、Node.js和Java實時BUG監控。 自從2016年雙十一正式上線，Fundebug累計處理了7億+錯誤事件，得到了Google、360、金山軟件、百姓網等眾多知名用戶的認可。歡迎免費試用！
版權聲明
轉載時請注明作者Fundebug以及本文地址：
https://blog.fundebug.com/2017/03/06/jquery-is-not-defined/
參考鏈接
The State of Front-End Tooling 2016 - Results
幸存者偏差是什么意思？- 知乎