r.js到底做了什么？

Question

我试图了解流行的r.js的好处.

好像......

• 连接手动选择的 JavaScript文件列表
• uglify /最小化组合代码
• 为CSS文件做一些类似的事情(合并它们)

此外,(它与通用联合/缩小工具的不同之处)似乎......

• 将节点式require()模块转换为AMD样式模块
• 命名匿名模块(例如define(['dependency'], function(){...})
• 为加载器插件提供一些支持,例如内联CSS文件

它好像不 ......

• 分析并自动解决文件中的依赖关系(例如,将文件包含foo.js到包中只是因为r.js找到了define(["foo"], ...)

这是正确的,还是我错过了什么？

Answer 1

你错了,因为r.js它会自动解决依赖关系.如果你有一个main.js文件:

define(["foo"], function (foo) {
});

然后,如果你问r.js到创建生成优化模块出来main.js,这将包括模块的代码foo到构建.

一些警告:

1. 可以告诉r.js排除模块.因此,如果您认为应该在优化捆绑中的模块不存在,则可能是它已被排除.(你知道你是如何使用的,r.js但是如果你使用其他人生成的捆绑包并且你想知道,那么这可能就是答案:它们特别排除了构建中的依赖关系.)

2. r.js除非你告诉它,否则找不到嵌套的依赖项.例如:

   define(function () {
       require(["foo"], function (foo) {
       });
   });
   

   r.jsfoo除非您在构建配置中设置findNestedDepencencies,否则不会发现这是必需的true.

3. r.js只能找到以字符串列表的形式指定的依赖项,这些字符串在require和define调用期望依赖项的位置放置为文字.所以,如果你这样做:

   define(function () {
       var deps = ["foo"];
       require(deps, function (foo) {
       });
   });
   

   然后r.js就不会知道那foo是一个依赖项,因为在require(deps, ...你的依赖项中出现了一个符号引用,而不是一个字符串列表.您必须foo在构建配置中手动指定为依赖项.没有标志可以打开来r.js查找这些案例.