使jQuery-Mobile与webpack一起工作

我试图用webpack加载jquery-mobile.但到目前为止没有运气.

这是我的jquery&的webpack.config代码. jQuery的手机:

loaders: [
    {
        test: /jquery.mobile.js$/,loader: "imports?define=>false,this=>window"
    },resolve: {
    alias: {
        "jquery": "jquery/src/jquery","jquery-mobile": "jquery-mobile/dist/jquery.mobile"
    },},plugins: [
    new webpack.ProvidePlugin({
       $: "jquery",jQuery: "jquery","window.jQuery": "jquery"
    }),]

这是jquery.mobile文件中的函数,它会导致麻烦:

(function ( root,doc,factory ) {
    if ( typeof define === "function" && define.amd ) {
        // AMD. Register as an anonymous module.
        define( [ "jquery" ],function ( $) {
            factory( $,root,doc );
            return $.mobile;
        });
    } else {
        // browser globals
        factory( root.jQuery,doc );
    }
}( this,document,function ( jQuery,window,undefined ) {
(function( $) {
    $.mobile = {};
}( jQuery ));

问题是root.jQuery未定义.在函数“this”===“window”里面,当我用imports-loader注入这个=>窗口时,我检查了一下.

一个奇怪的时刻:如果我将“this”替换为“window”,那样:

}( window,undefined ) {

一切都变好了.但我无法修改jquery.mobile文件,这可能会在将来造成麻烦.

非常感谢任何帮助,谢谢!

解决方法

以下需要imports-loader(npm install imports-loader –save)

jQuery mobile希望这是全局上下文(窗口):

require("imports?this=>window!jquery-mobile/dist/jquery.mobile.js");

参考:https://webpack.github.io/docs/shimming-modules.html

相关文章

页面搜索关键词突出 // 页面搜索关键词突出 $(function () {...
jQuery实时显示日期、时间 html: <span id=&quot...
jQuery 添加水印 <script src="../../../.....
中文:Sys.WebForms.PageRequestManagerParserErrorExceptio...
1. 用Response.Write方法 代码如下: Response.Write(&q...
Jquery实现按钮点击遮罩加载,处理完后恢复 思路: 1.点击按...