RequireJS + Waypoints:Object [object Object]没有方法'waypoint'

时间:2013-10-11 14:50:25

标签: jquery requirejs jquery-waypoints

尽管一切看起来都不错,但我无法使用带有RequireJS的航路点。 这是我的代码:http://jsfiddle.net/7nGzj/

main.js

requirejs.config({
    "baseUrl": "theme/PereOlive/js/lib",
    "paths": {
      "app":"../app",
      "jquery": "//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min"
    },
    "shim": {
        "waypoints.min": ["jquery"]
    }
});
requirejs(["app/common"]);

common.js

define([
    'jquery',
    "waypoints.min",
], function () {
    $(function () {
        console.log($.waypoints);
        $('#loading').waypoint(function (direction) {
            // do stuff
        });
    });
});

我甚至说它确保jQuery正确加载但它不起作用。 我的其他库就像它们应该的那样工作(responsiveslides,flexslider,hoverintent,smoothscroll,..)。

  • jQuery V1.10.2
  • Waypoints V2.0.3
  • RequireJS V2.1.8

1 个答案:

答案 0 :(得分:7)

符合AMD(和Waypoints)的依赖关系应该通过其注册的模块名称require d。找出该名称的最简单(唯一?)方法是查看lib的源代码:

// (...)
if (typeof define === 'function' && define.amd) {
  return define('waypoints', ['jquery'], function($) {
    return factory($, root);
  });
} // (...)

这是“waypoints”!

由于该库是兼容AMD的,因此您不需要垫片,但您需要定义它的路径(因为文件名可能与AMD模块名称不同):

requirejs.config({
    "baseUrl": "theme/PereOlive/js/lib",
    "paths": {
      "app": "../app",
      "waypoints": "path/to/waypoints.min"
    }
});

完成此操作后,您需要更改require来电:

define([
    "jquery",
    "waypoints" // this is the AMD module name
]

修正了你的jsfiddle:http://jsfiddle.net/jVdSk/2/