我已阅读关于Isotope支持RequireJS的文档,但我继承了一个使用稍微不同方式设置RequireJS的网站,并且我很难理解如何让Isotope和RequireJS一起工作。这是我第一次接触RequireJS。
设置如下:
每当网站添加新的功能时,就会创建一个新的独立的JavaScript文件。在我的情况下,我需要一个使用Isotope进行布局的新模块,因此我创建了一个如下所示的js文件:
然而,这仍然不起作用 - 它只是在网站上抛出了一个异常,在我调用
在Isotope文档(链接如上)中,它说我需要在Require中引用'jquery.bridget'才能让它工作,但我找到的所有示例都是以不同的方式设置的,并且似乎直接在RequireJS配置中包含实例化isotope的函数,而不是准备好从我的单独模块脚本调用它。
有人能指导如何使其工作吗?
非常感谢。
设置如下:
require.config({
paths: {
jquery: 'libs/jquery-1.11.0',
jqueryUI: 'libs/jquery-ui-1.11.1',
datepickerModule: 'modules/datepicker-module',
gridsetModule: 'plugins/gridset-overlay',
waypoints: 'plugins/waypoints',
booking: 'modules/book-widget',
mobileNav: 'modules/mobile-nav'
},
shim: {
'booking': ['waypoints']
}
});
/* -------------------------------------------------------------------------- */
/* ---------- Initialize app ------------------------------------------------ */
/* -------------------------------------------------------------------------- */
require(['jquery', 'jqueryUI', 'base', 'waypoints', 'booking', 'datepickerModule', 'gridsetModule', 'mobileNav'], function($, jqueryUI, base) {
'use strict';
/* ---------- Global modules -------------------------------------------- */
base.init();
});
每当网站添加新的功能时,就会创建一个新的独立的JavaScript文件。在我的情况下,我需要一个使用Isotope进行布局的新模块,因此我创建了一个如下所示的js文件:
define(['jquery'], function () {
'use strict';
$('#container').isotope();
});
然后我修改了上面的Require配置,现在它看起来像这样:
require.config({
paths: {
jquery: 'libs/jquery-1.11.0',
jqueryUI: 'libs/jquery-ui-1.11.1',
datepickerModule: 'modules/datepicker-module',
gridsetModule: 'plugins/gridset-overlay',
waypoints: 'plugins/waypoints',
isotope: 'plugins/isotope.pkgd',
booking: 'modules/book-widget',
mobileNav: 'modules/mobile-nav'
},
shim: {
'booking': ['waypoints'],
'isotope': ['jquery']
}
});
/* -------------------------------------------------------------------------- */
/* ---------- Initialize app ------------------------------------------------ */
/* -------------------------------------------------------------------------- */
require(['jquery', 'jqueryUI', 'base', 'waypoints', 'booking', 'datepickerModule', 'gridsetModule', 'mobileNav', 'isotope'], function($, jqueryUI, base) {
'use strict';
/* ---------- Global modules -------------------------------------------- */
base.init();
});
然而,这仍然不起作用 - 它只是在网站上抛出了一个异常,在我调用
.isotope
时返回undefined is not a function
。在Isotope文档(链接如上)中,它说我需要在Require中引用'jquery.bridget'才能让它工作,但我找到的所有示例都是以不同的方式设置的,并且似乎直接在RequireJS配置中包含实例化isotope的函数,而不是准备好从我的单独模块脚本调用它。
有人能指导如何使其工作吗?
非常感谢。