时间戳

首页 > 解决方案 > 通过 Javascript 修复 Dojo 和 JQuery 依赖库的 multipleDefine 冲突

javascript - 通过 Javascript 修复 Dojo 和 JQuery 依赖库的 multipleDefine 冲突

问题描述

这个问题之前已经回答过很多次了，我知道一种解决方案是简单地改变它，所以（Esri 的）dojo 是最后一个加载的。

问题是我正在开发一个模块化小部件，它无法访问页面的 html 来更改顺序，我只能通过 Dojo 的 AMD 加载器加载库。

文件夹结构：

/Widget
--/Main.js
--/Datatable.js

这是 Main.js 文件：

define([
  './Datatable', 
  'https://code.jquery.com/jquery-3.3.1.min.js',
  'https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.bundle.js',
  ],
function(Datatable){ ... }

和 Datatable.js（只是我为组织创建的另一个模块）：

define([
    'https://cdn.datatables.net/v/bs4/dt-1.10.18/r-2.2.2/datatables.min.js'
    ],function(){ ... }

我在这里有两个主要问题；

1) AMD Loader 是异步的，不会解析非 AMD 模块的依赖关系，这意味着顺序应该很重要

datatables.min.js需要bootstrap.bundle.js，需要jquery-3.3.1.min.js

所以，如果我很幸运，请求将根据延迟按顺序加载，不是很可靠......

2）Bootstrap 和 Datatable 通用 javascript 文件都会引发“multipleDefine”错误，可能是由于它们试图定义“jquery”，我真的不确定如何解决这个问题（拥有它们的本地编辑副本并不理想)

我该如何解决这两个问题？

标签： javascriptdojorequirejsamdarcgis-js-api

解决方案

对于订单，您可能可以执行以下操作：

require(['https://code.jquery.com/jquery-3.3.1.min.js'], function() {
    require(['https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.bundle.js'], function() {
        define(['./Datatable'], function(Datatable){ ... }
    });
});

这将强制以特定顺序解决。
当multipleDefine2 个组件尝试define在全局范围（此处为window）上创建函数时会引发错误。
很难给出一个完美的答案。
如果您可以设置小提琴或类似的东西，我可以进行更深入的了解。
我想到的一件事：您可以delete window.define在加载引发错误的文件之一之前尝试正确...但这很丑陋，甚至可能不起作用...

推荐阅读