关于在Require.js使用一个JS插件的问题
我需要在项目中引用一个js控件,这个控件依赖于a.js,b.js,c.js,.....n.js N多个js以及jquery及jquery-ui,各js之间相互还有依赖关系,也就是说必须先加载某一部分才能加载另一部分,最终才能加载整个控件。我 想使用require.js来引用他,以避免在head部分书写过多的script标签,但是require.js是异步的,各js会在同一时间加载导致 浏览器报错,我应该如何处理这个问题?如下是我的配置代码,欢迎大家指正。
require.config({
baseUrl:
"../../js/jsPlumb/"
,
paths:{
"jquery"
:
"http://cdn.bootcss.com/jquery/1.9.1/jquery.min"
,
"jquery-ui"
:
"http://cdn.bootcss.com/jqueryui/1.10.2/jquery-ui.min"
,
"jsBezier"
:
"lib/jsBezier-0.6-min"
,
"mottle"
:
"lib/mottle-0.3"
,
"biltong"
:
"lib/biltong-0.2"
,
"katavorio"
:
"lib/katavorio-0.2"
,
"util"
:
"src/util"
,
"dom-adapter"
:
"src/dom-adapter"
,
"jsPlumb"
:
"src/jsPlumb"
,
"endpoint"
:
"src/endpoint"
,
"connection"
:
"src/connection"
,
"anchors"
:
"src/anchors"
,
"defaults"
:
"src/defaults"
,
"connectors-bezier"
:
"src/connectors-bezier"
,
"connectors-statemachine"
:
"src/connectors-statemachine"
,
"connectors-flowchart"
:
"src/connectors-flowchart"
,
"renderers-svg"
:
"src/renderers-svg"
,
"renderers-vml"
:
"src/renderers-vml"
,
"connector-editors"
:
"src/connector-editors"
,
"domPlumb"
:
"src/dom.jsPlumb"
},
shim:{
"jquery-ui"
:{
deps:[
'jquery'
],
exports:
"jquery-ui"
},
"jsPlumb"
:{
deps:[
"jquery"
,
"jquery-ui"
,
"jsBezier"
,
"mottle"
,
"biltong"
,
"katavorio"
,
"util"
,
"dom-adapter"
,
"endpoint"
,
"connection"
,
"anchors"
,
"defaults"
,
"connectors-bezier"
,
"connectors-statemachine"
,
"connectors-flowchart"
,
"renderers-svg"
,
"renderers-vml"
,
"connector-editors"
,
"domPlumb"
],
exports:
"jsPlumb"
}
}
});
require([
"jquery"
,
"jquery-ui"
,
"jsPlumb"
],
function
($,ui){
var
GHandler = jsPlumb.getInstance();
GHandler.draggable($(
"#btn"
));
})
这个控件的名称叫做jsplumb用于图形拖拽及连线的。jquery及jquery-ui使用cdn,jsplumb放在本地目录js/jsplumb下