JointJS依赖Jquery导致ExtJS v3应用异常，求兼容解决方案

冲突原因 #

你的异常本质是Ext JS v3和jQuery都默认占用全局$作为核心别名，同时旧版本Ext对全局变量的污染比较严重，新jQuery的全局挂载行为会覆盖Ext的部分全局引用导致运行异常。

可行解决方案 #

使用jQuery的noConflict()机制做全局隔离，同时手动给JointJS的依赖链注入专用的jQuery实例，完全不占用全局变量空间，不会对现有Ext JS应用产生任何影响。
具体步骤：

• 加载jQuery后立即执行隔离，释放全局$和jQuery变量，恢复到Ext JS占用的状态，同时把当前jQuery实例保存为专属变量供JointJS生态使用
• 加载lodash后，加载Backbone时手动给Backbone注入专属jQuery实例（JointJS依赖Backbone，Backbone默认优先取全局$，手动指定后就不会访问Ext的$）
• 最后加载JointJS，会自动读取Backbone上绑定的jQuery实例正常运行

修改后的资源引入代码 #

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.js"></script>
<script>
// 深度隔离：true表示同时释放全局$和jQuery，自动恢复为加载jQuery前的Ext变量状态
const jqForJoint = jQuery.noConflict(true);
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.20/lodash.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.4.0/backbone.js"></script>
<script>
// 给Backbone注入专用jQuery实例，JointJS会自动读取该实例
Backbone.$ = jqForJoint;
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jointjs/3.3.1/joint.js"></script>

注意事项 #

• 无论Ext JS资源是在上述代码之前还是之后加载，该方案都兼容，不会修改Ext的任何全局配置
• 后续如果需要操作JointJS相关DOM，直接用jqForJoint代替$调用即可，不要使用全局$避免和Ext逻辑冲突

内容的提问来源于stack exchange，提问作者milan pandya