jQuery源代码使用Require.js,但最终文件不是吗? [英] jQuery source code uses Require.js, but the final file doesn't?
问题描述
未压缩的jQuery文件: http://code.jquery.com/jquery-2.0. 3.js jQuery源代码: https://github.com/jquery/jquery/blob /master/src/core.js
Uncompressed jQuery file: http://code.jquery.com/jquery-2.0.3.js jQuery Source code: https://github.com/jquery/jquery/blob/master/src/core.js
他们正在做些什么,以使最终输出似乎没有在后台使用Require.js? Require.js示例告诉您将整个库插入代码中,以使其作为单个文件独立工作.
What are they doing to make it seem like the final output is not using Require.js under the hood? Require.js examples tells you to insert the entire library into your code to make it work standalone as a single file.
Almond.js(Require.js的较小版本)还告诉您将自身插入代码中以具有独立的javascript文件.
Almond.js, a smaller version of Require.js also tell you to insert itself into your code to have a standalone javascript file.
当缩小时,我不关心额外的膨胀,它只是几个额外的killobytes(对于almond.js),但是未缩小的则几乎不可读.我必须一直向下滚动过去的almond.js代码,才能查看我的应用程序逻辑.
When minified, I don't care for extra bloat, it's only a few extra killobytes (for almond.js), but unminified is barely readable. I have to scroll all the way down, past almond.js code to see my application logic.
如何使我的代码类似于jQuery,其中最终输出看起来不像Frankenweenie?
推荐答案
简短答案:
您必须创建自己的自定义生成过程.
Short answer:
You have to create your own custom build procedure.
jQuery的构建过程仅起作用,因为jQuery根据一种模式定义了其模块,该模式允许convert
函数将源转换为不使用define
的分布式文件.如果有人想复制jQuery的功能,那就没有捷径了:1)必须根据一种模式设计模块,该模式将允许剥离define
调用,并且2)您必须具有自定义转换功能. jQuery就是这样做的.将jQuery模块组合到一个文件中的整个逻辑在 build/tasks/build.js中.
jQuery's build procedure works only because jQuery defines its modules according to a pattern that allows a convert
function to transform the source into a distributed file that does not use define
. If anyone wants to replicate what jQuery does, there's no shortcut: 1) the modules have to be designed according to a pattern which will allow stripping out the define
calls, and 2) you have to have a custom conversion function. That's what jQuery does. The entire logic that combines the jQuery modules into one file is in build/tasks/build.js.
此文件定义了传递给r.js
的自定义配置.重要的选择是:
This file defines a custom configuration that it passes to r.js
. The important option are:
-
设置为
-
out
.这是单身 优化产生的文件.
"dist/jquery.js"
的out
which is set to"dist/jquery.js"
. This is the single file produced by the optimization.
wrap.startFile
.这个文件
将放在dist/jquery.js
之前.
wrap.startFile
which is set to "src/intro.js"
. This file
will be prepended to dist/jquery.js
.
wrap.endFile
.该文件将
附加到dist/jquery.js
.
wrap.endFile
which is set to "src/outro.js"
. This file will
be appended to dist/jquery.js
.
onBuildWrite
.这是自定义函数.
每次r.js
要将模块输出到最终输出文件中时,都会调用一次convert函数.该函数的输出是r.js
写入最终文件的内容.它执行以下操作:
The convert function is called every time r.js
wants to output a module into the final output file. The output of that function is what r.js
writes to the final file. It does the following:
-
如果模块来自
var/
目录,则该模块将为 转换如下.让我们以 src/var/toString.js :
If a module is from the
var/
directory, the module will be transformed as follows. Let's take the case of src/var/toString.js:
define([
"./class2type"
], function( class2type ) {
return class2type.toString;
});
它将变为:
var toString = class2type.toString;
否则,将define(...)
调用替换为传递给define
的回调的内容,剥离最后的return
语句,并剥离对exports
的所有赋值.
Otherwise, the define(...)
call is replace with the contents of the callback passed to define
, the final return
statement is stripped and any assignments to exports
are stripped.
我已省略了与您的问题无关的详细信息.
I've omitted details that do not specifically pertain to your question.
这篇关于jQuery源代码使用Require.js,但最终文件不是吗?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!