Electron中Jquery的引入方式

最新推荐文章于 2024-06-26 09:51:03 发布

weixin_30871701

最新推荐文章于 2024-06-26 09:51:03 发布

阅读量561

点赞数

文章标签： javascript json ViewUI

原文链接：http://www.cnblogs.com/zyh1989/p/6232344.html

版权

Electron默认启用了Node.js的require模块，而jQuery等新版本框架为了支持commondJS标准，当Window中存在require时，会启用模块引入的方式，导致报错 Uncaught ReferenceError: $ is not defined，本文研究了高低版本jQuery引入的正确方式。

1. 报错原因

Electron默认启用了Node.js的require模块，而jQuery等新版本框架为了支持commondJS标准，当Window中存在require时，会启用模块引入的方式.

2. 几种引入方式

方式1，html页面直接引入：

        <script type="text/javascript" src="./js/jquery-1.9.1.min.js"></script>

经测试jquery-1.9.1可以,jquery-1.11.1按这种方式报错

方式2，html页面引入时：

    <script>window.$ = window.jQuery = require('./js/jquery-1.11.0.min.js');</script>

经测试jquery-1.11.0可以,jquery-1.9.1按这种方式报错

方式3，html页面引入时重命名并删除对象

        <head>
            <script>
            window.nodeRequire = require;
            delete window.require;
            delete window.exports;
            delete window.module;
            </script>
            <script type="text/javascript" src="./js/jquery-1.9.1.min.js"></script>
        </head>

经测试jquery-1.9.1可以,jquery-1.11.1按这种方式报错

方式4,去掉框架中的模块引入判断代码，将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)}

html页面引用时

        <script type="text/javascript" src="./js/jquery-1.11.0.min.js"></script>

jquery-1.11.0成功,而jquery-1.9.1中第一行没有这个代码，故不能采用这种方式

方式5，如果开发了一定的量，而且不想使用Node.js模块，大可以去掉require模块化引入，直接使用以下方法禁用Node.js的require模块化引入，即可正常使用任何框架

             // In the main process.
            let win = new BrowserWindow({
              webPreferences: {
                nodeIntegration: false
              }
            });

总结

低版本JQuery建议方式1，高版本JQuery建议方式2；不使用Node.js模块的话可以尝试方式5

参考资料

Electron基础 - 解决无法使用jQuery/RequireJS/Meteor/AngularJS 的问题 - GuanYong
electron中怎样导入jquery不报错 - jykl

转载于:https://www.cnblogs.com/zyh1989/p/6232344.html

weixin_30871701

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Electron中Jquery的引入方式

Electron默认启用了Node.js的require模块，而jQuery等新版本框架为了支持commondJS标准，当Window中存在require时，会启用模块引入的方式，导致报错 Uncaught ReferenceError: $ is not defined，本文研究了高低版本jQuery引入的正确方式。1. 报错原因Electron默认启用了Node.js的require模...
复制链接

扫一扫