最近扒网站 - palleton,
一个单页app,
主模块(requirejs的data-main指向的文件)app.compiled.js里面,
出现了这样的结构:
开头
http://i.imgur.com/cIEcXdz.png
结尾
http://i.imgur.com/8yUYHjo.png
定义了多个相互依赖的模块。
想问下这样的结构是什么原理?
(requirejs文档没有讲这种结构。
搜了下网上也只是说一个文件写一个模块,再用Optimizer来弄)
1
Septembers 2015-06-01 04:46:01 +08:00
|
2
Septembers 2015-06-01 04:47:05 +08:00
|
3
sydneyzh OP @Septembers gist被墙了。没开代理连这页的回复框都刷不出来。我还以为贴被封了。谢谢但回答没有帮助。
|
4
sydneyzh OP 这个文件貌似还就是optimization tool生成的
|
6
iwege 2015-06-01 14:09:19 +08:00 1
感觉应该是r.js 合并生成的。这一般是发布的时候build tools 来生成的代码。
|
7
jsq2627 2015-06-01 16:19:19 +08:00 1
要在同一个文件声明多个模块,就像 2L 说的一样,显式在 define 第一个参数指定模块名。文档里说是不推荐这么做的,而是统一约定一个文件一个模块,用文件名表示模块名。
楼主贴的这段代码是 Optimizer 生成的。它把每个文件的代码嵌入到了一个自调用里: (function () { // my-module-foo.js }).call(this), (function () { // my-module-bar.js }).call(this); 因为这时所有模块合并到了一个文件,没法用文件名做模块名了。所以 Optimizer 把原来的文件名加到了 define 第一个参数。 (function () { // my-module-foo.js define("my-module-foo", [], function { /* ... */ }); }).call(this), (function () { // my-module-bar.js define("my-module-bar", [], function { /* ... */ }); }).call(this); 所以就有了这样的结构。 |
8
latelx 2015-06-02 11:34:47 +08:00 1
有时候一个模块里定义多个模块的需要还是有的,比如模板,一起作为一个目录给别人用总觉得怪怪的,这时候就有合并的需求。
我把主模块定义为匿名模块,模板定义为一个命名模块(有命名空间),然后匿名模块将模块依赖就可以了,requirejs会自动将匿名模块作为加载合并文件时的模块定义。 [https://gist.github.com/846f1245c2ea69e2f5d6](https://gist.github.com/846f1245c2ea69e2f5d6) |
9
leonlu 2015-06-02 15:57:21 +08:00 1
amd推荐的开发模式是一个文件只写一个模块,同时推荐只定义匿名的模块。也就是这样:
比如, app/index.js里边的代码应该是 // 这里定义一个匿名模块 define(function (require) { // 这里明确写出所有的依赖 var common = require('../common/index'); // 这里是模块输出 return {}; }); 那么在使用r.js或者其他构建工具的时候,通过语法分析找到相关的数据(主要是路径和依赖),会编译成一个具名且明确依赖的模块,并且将依赖放到前边,比如app/index.js会被编译成这样: define('common/index', [], function (require) { /*.. */}) define('app/index', ['../common/index'], function (require) { /* .. */ }); 合并的原因是,不合并的amd脚本根本没办法用。一个页面上异步加载好几十个脚本,然后才算启动成功,太low了,根本不能用到生产环境上。。。 当然还有其他方面的考虑,请参考amd的规范。 |