代码在错误的地方寻找模块

Posted 2023-02-16

【中文标题】代码在错误的地方寻找模块

【英文标题】：Code looking for modules in the wrong place

【发布时间】：2012-12-10 18:16:22

【问题描述】：

我使用 build.dojotoolkit.org（我的第一次尝试）创建了一个多层构建，包含 3 层：dojo.js、dojox.js、dijit.js。每个 js 文件都上传到自己的文件夹中（dojo、dojox、dijit）。

当我运行代码时，我希望它在 dijit.js 中查找以获取像 dijit.form.TextBox 这样的表单模块。但相反，它会尝试加载 dijit/form/TextBox.js，当然最终会出现 404 错误。

我做错了什么？

如果有帮助，文件就在这里： http://usermanagedsolutions.com/Demos/Pages

【参考方案1】：

手动将每一层包含在页面上的脚本标记中。

<script src="path/to/dojo.js" />
<script src="path/to/dojox.js" />
<script src="path/to/dijit.js" />

这将使您在构建中定义的所有模块可用。当您需要文本框时，Dojo 会看到它有代码，并且不会进行 XHR 调用。

即使您不打算使用单个文件，您也可能希望将它们放在服务器上。这样，如果有人忘记将文件添加到构建中，则会产生 xhr 请求，而不是 javascript 错误。

---

回复：AMD

当您以我上面描述的方式包含层时，您并没有加载包含构建的所有模块 - 您只是使定义函数可用，而无需发出 xhr 请求。

如果您查看构建输出的 js 文件，该文件包含模块路径到函数的映射，该函数在调用时将定义模块。

所以当你写下面的代码时

require(["dijit/form/TextBox"], function(TextBox)
  ...
);

AMD 将首先确定dijit/form/TextBox 是否已被定义。如果是这样，它将只获取对象并执行回调。

如果模块尚未定义，AMD 将在其缓存中查看定义代码是否可用。当您包含脚本文件时，您将提供定义函数的缓存。 AMD 找到定义模块的代码。它调用这个定义函数，结果是传递给回调的对象。对dijit/form/TextBox 的后续要求也将使用上述对象。

如果模块尚未定义且 AMD 未在其缓存中找到定义函数，则 AMD 将向服务器发出 XHR 请求以尝试定位特定模块代码。 XHR 调用的结果应该提供定义函数。 AMD 将调用该函数并将结果作为对象传递给回调。同样，dijit/form/TextBox 的后续要求也将使用此对象。

Dojo 构建提供了 1) 缩小代码和 2) 将其组合成需要从服务器请求的更少文件的能力。

AMD 允许您编写可在任一环境中运行的代码（使用构建文件或单个文件），而无需进行修改。

【讨论】：

我一定错过了什么。如果我需要预先加载我的脚本，AMD 的意义何在？我的页面有两种模式（表单或图表），我的假设是当我需要 dijit 模块时，dojo 会加载 dijit.js。

增强了我的回答以解决您的问题

感谢 Graig，这很有帮助。如果我理解正确，这意味着为了进一步优化，我需要在 require 之前添加一个额外的层，它只会加载我特定模式所需的 js 包。此外，将单个文件作为安全网放在服务器上的建议也不错。

好吧，我试过了，但我仍然面临同样的问题。 3 个 js 文件加载正常，但代码仍在尝试从 dijit/form 加载模块。