溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
最近在了解Electron框架寫應用，偶然發現在html中使用<script src="./jquery.js"></script>這種方式引入JQuery，明明引入了，程序中卻始終報錯顯示：Uncaught ReferenceError: $ is not defined。
經查閱資料，發現不僅JQuery不能用，RequireJS、Meteor、AngularJS也不能使用。
原因是Electron 在運行環境中引入了 Node.js，默認啟用了Node.js的require模塊，而這些框架為了支持commondJS標準，當Window中存在require時，會啟用模塊引入的方式。所以在 DOM 中有一些額外的變量，比如module、exports和require。這導致了許多庫不能正常運行，因為它們也需要將同名的變量加入運行環境中。
解決方法有很多，官方的解決方法是1、2：
1、禁用Node.js：若不使用Node.js則通過在主進程中禁用Node.js來解決。
// 在主進程中
var mainWindow = new BrowserWindow({
webPreferences: {
nodeIntegration: false
}
});
2、變量重命名：假如依然需要使用 Node.js 和 Electron 提供的 API，則需要在引入那些庫之前將這些變量重命名。
<head>
<script>
// 重命名 Electron 提供的 require
window.nodeRequire = require;
delete window.require;
delete window.exports;
delete window.module;
</script>
<script type="text/javascript" src="jquery.js"></script>
</head>
這樣，就可以用nodeRequire來使用node模塊，又能使用jQUery了，但這種方法不適合web項目，在web里將無法正常瀏覽。
3、采用Node.js的require引入：（有些時候不要帶后綴名.js）
<script>window.$ = window.jQuery = require("./js/jquery.min");</script>
4、自定義$、jQuery變量
<script src="https://code.jquery.com/jquery-2.2.0.min.js"></script>
<script>if (typeof module === 'object') {window.jQuery = window.$ = module.exports;};</script>
5、
<!-- Insert this line above script imports -->
<script>if (typeof module === 'object') {window.module = module;module = undefined;}</script>
<!-- normal script imports etc -->
<script src="scripts/jquery.min.js"></script>
<script src="scripts/vendor.js"></script>
<!-- Insert this line after script imports -->
<script>if (window.module) module = window.module;</script>
6、去掉框架中的模塊引入判斷代碼：針對JQuery
將JQuery中的如何代碼
!function(a,b){"object"==typeof module&&"object"==typeof module.exports?module.exports=a.document?b(a,!0):function(a){if(!a.document)throw new Error("jQuery requires a window with a document");return b(a)}:b(a)}
改為
!function(a,b){b(a)}
我個人還是比較喜歡使用第三種，簡單代碼少
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
