RequireJS + Zepto + Waypoints：无法读取未定义的属性“应用”答案

【问题标题】：RequireJS + Zepto + Waypoints: Cannot read property 'apply' of undefinedRequireJS + Zepto + Waypoints：无法读取未定义的属性“应用”
【发布时间】：2015-04-08 13:10:24
【问题描述】：

我正在尝试将waypoints 与zepto 和RequireJS 一起使用。

我的 requireJS 配置如下所示：

requirejs : {
options : {
    baseUrl : '<%= config.app.js %>',
    paths : {
        almond : '../node_modules/almond/almond',
        zepto : '../node_modules/zepto/zepto.min',
        'progressbar' : '../node_modules/progressbar.js/dist/progressbar',
        waypoints : '../node_modules/waypoints/lib/zepto.waypoints'
    },
    shim : {
        zepto : {
            exports : '$'
        }
    },
    mainConfigFile: '<%= config.app.js %>/common.js',
    include : ['common'],
    name : 'almond',
    out : 'dist/js/<%= pkg.name %>.js', 
    insertRequire: ['common'],
    wrap: true
},
dist : {
    options : {
        optimize: 'uglify2'
    }
},
dev : {
    options : {
        optimize: 'none'
    }
}
},

另外，我的common.js文件如下：

define(['zepto', 'waypoints'], function($) {

var waypoint = $('#experience').waypoint({
    handler: function(direction) {}
});

});

但是当页面加载时，我得到以下错误：

Uncaught TypeError: Cannot read property 'apply' of undefined

错误来自waypoints 插件库上的这一行：

return this.$element[method].apply(this.$element, args)

当我调试代码时，我可以看到function ZeptoAdapter(element) 被调用了两次，一次以$('#experience') 作为元素，一次以window。第二次是失败的时候，因为this.$element 是未定义的。难道我做错了什么？包含 zepto 插件的正确方法是什么？

谢谢，

【问题讨论】：

标签： javascript requirejs jquery-waypoints zepto

【解决方案1】：

Waypoints 不会为 CommonJS 或 AMD 做任何导出操作。我相信你也需要填充它：

shim : {
  zepto : {
    exports : '$'
  },
  waypoints: {
    deps: ['zepto'],
    exports: 'Waypoint'
  }
}

【讨论】：

【解决方案2】：

这解决了我的问题

shim : {
    jqueryWaypoints:{
        deps: ['jquery'],
        exports: 'jqueryWaypoints'
   }
}

【讨论】：