RequireJS: 为什么define()可以使用相对路径，而require()不行？

Question

假设您有以下目录结构和以下文件：

root
|-- require-jquery.js
+-- folder
     |-- index.html
     |-- main.js
     +-- AnotherModule.js

在RequireJS中，当你引用以“.”开头的模块时，RequireJS会在当前模块所在的同一文件夹中查找，即使那是一个子目录。然而，如果你在调用define()之前改变了baseUrl，RequireJS将把依赖项映射到新的baseUrl。

你可以通过在index.html中设置baseUrl，并将data-main更改为相对于baseUrl的路径来解决这个问题：

folder/index.html：

<script>
    var require = {
        baseUrl : "../"
    };
</script>
<script data-main="folder/main" src="../require-jquery.js"></script>

folder/main.js:

define(
        [ "jquery", './AnotherModule' ],
        function($, AnotherModule) {});

这仅适用于define()：

folder/main.js：

require(
        [ "jquery", './AnotherModule' ],
        function($, AnotherModule) {});

如果我使用require()尝试它，RequireJS将在根目录中查找AnotherModule.js而不是文件夹中。为什么会这样，特别是define()和require()之间的设计差异是什么？

- Chris

Answer 1

这是因为 define 指定了模块名称而 require 没有指定。

可以像这样调用 define：

define('folder/main',
        [ "jquery", './AnotherModule' ],
        function($, AnotherModule) {});

第一个参数是模块名称——显式指向模块的路径。Define() 总是隐含地指定一个路径，通常不推荐使用显式路径（见此处）。Require() 不需要名称参数。

当在 define() 中包含一个相对依赖项（比如 './AnotherModule'），它会相对于模块名称被找到。在这种情况下，./AnotherModule 会解析为 folder/AnotherModule。

调用 require() 时，没有模块名称。相对依赖项被解析为根目录。

- Chris