[英]Gridstack.js not loading correctly in RequireJS using Underscore.js, jQuery, and jQueryUI
我在使Gridstack在Backbone应用程序中工作时遇到问题。
精简版的RequireJS配置如下所示:
require.config({
paths: {
jquery: '../assets/packages/jquery/1.12.0/jquery.min',
underscore: 'libs/underscore/underscore-min',
jqueryui: '../assets/packages/jqueryui/1.11.4/custom/jquery-ui.min',,
gridstack: '../assets/packages/gridstack/0.2.4/gridstack.min',
},
shim: {
"gridstack": {
deps: ["jquery", "jqueryui", "underscore"],
},
}
});
问题是Gridstack试图为Lodash和jQueryUI组件“ core”,“ mouse”,“ draggable”,“ resizable”和“ widget”查找获取文件。 见下图。
Backbone视图文件(再次,已归结)如下所示:
define([
'jquery',
'jqueryui',
'underscore',
'backbone',
'gridstack',
], function(
$,
jqueryui,
_,
Backbone,
gridstack
){
var MyView = Backbone.View.extend({
el: $("#page"),
className: "MyView",
initialize: function(){
console.log('gridstack', gridstack);
},
});
return MyView;
});
我使用的是Underscore.js(1.8.3)而不是Lodash,但这对于此处的文档应该没问题: https : //github.com/troolee/gridstack.js
无论如何,是否有迫使Gridstack理解其所有依赖项都已加载的信息?
编辑2016-02-18 12:47:00
jQueryUI是从https://jqueryui.com/download/下载的,其中包含工具提示之外的所有内容; 与Bootstrap一起使用时会引起问题。
我看到很多人通过Bower获得AMD版的jQueryUI。 但是,该程序包对于其他所有功能都可以正常工作,因此我倾向于认为问题出在Gridstack上。
尽管Gridstack的问题仍然存在,并且Gridstack的作者并不打算完全支持RequireJS( https://github.com/troolee/gridstack.js/issues/332 ),但我发现了另一种名为Gridster的解决方案。
对于找不到jquery-ui的错误,我必须在我的require.config中使用map来将所有文件映射到单个文件
paths: {
"jquery": "path/to/jquery-3.2.1.min",
"jquery-ui": "path/to/jquery-ui.min",
"gridstack": "path/to/gridstack",
},
map: {
'c/gridstack.jQueryUI': {
'jquery-ui/data': 'jquery-ui',
'jquery-ui/disable-selection': 'jquery-ui',
'jquery-ui/focusable': 'jquery-ui',
'jquery-ui/form': 'jquery-ui',
'jquery-ui/ie': 'jquery-ui',
'jquery-ui/keycode': 'jquery-ui',
'jquery-ui/labels': 'jquery-ui',
'jquery-ui/jquery-1-7': 'jquery-ui',
'jquery-ui/plugin': 'jquery-ui',
'jquery-ui/safe-active-element': 'jquery-ui',
'jquery-ui/safe-blur': 'jquery-ui',
'jquery-ui/scroll-parent': 'jquery-ui',
'jquery-ui/tabbable': 'jquery-ui',
'jquery-ui/unique-id': 'jquery-ui',
'jquery-ui/version': 'jquery-ui',
'jquery-ui/widget': 'jquery-ui',
'jquery-ui/widgets/mouse': 'jquery-ui',
'jquery-ui/widgets/draggable': 'jquery-ui',
'jquery-ui/widgets/droppable': 'jquery-ui',
'jquery-ui/widgets/resizable': 'jquery-ui',
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.