jQuery 源代码使用 Require.js，但最终文件没有？

Question

未压缩的 jQuery 文件:http://code.jquery.com/jquery-2.0.3.js jQuery 源代码:https://github.com/jquery/jquery/blob/master/src/core.js

他们做了什么让最终输出看起来没有在幕后使用 Require.js？ Require.js 示例告诉您将整个库插入到代码中，使其作为单个文件独立工作。

Almond.js(Require.js 的较小版本)还会告诉您将其自身插入到代码中以获得独立的 javascript 文件。

缩小后，我不关心额外的膨胀，它只是几个额外的千字节(对于 almond.js)，但未缩小的几乎不可读。我必须一直向下滚动，经过 almond.js 代码才能看到我的应用程序逻辑。

问题

如何使我的代码类似于 jQuery，使最终输出看起来不像科学怪人？

Answer 1

简短回答:

您必须创建自己的自定义构建过程。

长答案

jQuery 的构建过程之所以有效，只是因为 jQuery 根据一种模式定义其模块，该模式允许 convert 函数将源代码转换为不使用 define 的分布式文件。如果有人想复制 jQuery 的功能，没有捷径可走:1) 模块必须根据允许删除 define 调用的模式进行设计，2) 你必须有一个自定义的转换功能。这就是 jQuery 的作用。将 jQuery 模块组合到一个文件中的整个逻辑位于 build/tasks/build.js 中。 .

此文件定义了传递给 r.js 的自定义配置。重要的选项是:

• out 设置为 "dist/jquery.js"。这是单曲 优化生成的文件。

• wrap.startFile 设置为 "src/intro.js"。这个文件 将被添加到 dist/jquery.js 之前。

• wrap.endFile 设置为 "src/outro.js"。该文件将 附加到 dist/jquery.js。

• onBuildWrite 设置为 convert。这是custom function .

每次 r.js 想要将模块输出到最终输出文件时，都会调用转换函数。该函数的输出是 r.js 写入最终文件的内容。它执行以下操作:

• 如果模块来自 var/ 目录，则该模块将 变换如下。让我们看一下这个例子 src/var/toString.js :

  define([
      "./class2type"
      ], function( class2type ) {
      return class2type.toString;
  });
  

  它将变成:

  var toString = class2type.toString;
  

• 否则，define(...) 调用将替换为传递给 define 的回调内容，最终返回 语句被剥离，并且对 exports 的任何赋值都被剥离。

我省略了与您的问题无关的详细信息。