使用 require.js 加载 XML3D

Question

XML3D 不适用于 require.js even if one make sure its loaded first and use "shim" 配置选项（对于非 AMD 模块）。

我有以下代码：

index.html 包含 xml3d 标签

<xml3d>
...some stuff..
</xml3>
<script data-main="scripts/main.js" src="scripts/require.js"></script>

main.js

requirejs.config({
  paths: {
    xml3d: *url*
  },
  shim: {
    'xml3d': { exports: 'XML3D' }
  }
});

requirejs(['xml3d'], function (XML3D) { console.log(XML3D) // that works });

console.log 代码显示了正确的信息，但是 XML3D canvas 没有正确打开（它缩小到很小的区域并且没有渲染任何对象）。

而且，是的

 <script src="xml3D url"></script>

而不是使用 require.js 工作正常（一切都被渲染。）所以下面的代码有效（由 index.html 没有 main.js).

<xml3d>
...some stuff..
</xml3>
<script src="url of XML3D"></script>

Answer 1

你说得对，这是对 XML3D 初始化方式的一个简单疏忽。我们在没有先检查 document.readyState 的情况下为 DOMContentLoaded 注册了一个侦听器，因此从逻辑上讲，当 require.js 加载 XML3D 时，DOMContentLoaded 事件已经被调度。

此修复程序将成为即将发布的 4.9.4 版本的一部分，并且正在 hotfix-4.9.4 branch 中。

同时没有简单的解决方法（除非您想在通过 require.js 加载 XML3D 后手动触发 DOMContentLoaded 事件，这非常混乱）但您可以构建修补程序分支或拉取修复你的 xml3d.js 副本，因为它只有几行。

使用 require.js 加载 XML3D

Loading XML3D with require.js

javascript

requirejs

xml3d