arale/
-- dist/
-- xxx/1.0.0/..
-- lib/
-- xxx/
-- src/
-- __config.js
-- widget.js
-- view.js
-- model.js
-- base.css
-- /
static/
-- js/
-- base/
-- src/
-- __config.js
-- base.js
-- cahser.js
-- personal.js
-- sites/
-- bj.js
-- hz.js
-- sh.js
-- /
-- module/
-- css
-- base/
-- release # 含义同 dist
下面我们将以一个系统项目为例子, 说明相关打包流程,和打包后的文件变化情况, 以及相关部署的操作.
/** __config.js **/
/** 相关不重要的已被省略, 具体的配置参看相关文档**/
define({
………..
"version": '1.0.1-dev',
"parent": '/config/cashier/1.1.0/',
"alias": {
'_': 'ar/underscore/0.9.2/underscore.js',
'xbox': 'ar/xbox/2.0/xbox.js',
'sec': 'cashier/1.2/security/'
},
"dist": {
'cashier.js': ['cashier.js', 'base.js'], // 在dist目录产生a.js, 并把b.js, c.js, d.js打包合并到a.js中
'personal.js': ['personal.js', 'base.js']
'sites': ['sites/*.js']
}, // 文件产生策略. 根据这个配置来确定对外部署的文件.
"repository": "http://alipay.im/arale2/repos/",
});
/** cashier.js **/
define(function(require, exports, module) {
var xbox = require('xbox');
var base = require('./base');
var a = require('sec/a.js');
var b = require('sec/b.js');
exports.doSth = function() {
//.…..
};
});
/** personal.js **/
define(function(require, exports, module) {
var _ = require('_');
var base = require('./base');
exports.doSth = function() {
//.…..
};
});
/** base.js **/
define(function(require, exports, module) {
var jquery = require('jquery');
exports.doSth = function() {
//.…..
};
});
其中我们在打包后主要关注的就是dist目录的情况. 这个目录中内容主要是根据在 __config.js 中的配置来确定的. 下面就列出了按照上面的配置, 我们这个目录的相关内容, 和源码的变化.
/
-- /base/1.0.1-dev/cashier.js
-- /base/1.0.1-dev/personal.js
-- /base/1.0-1-dev/sites/
-- bj.js
-- hz.js
-- sh.js
/** cashier.js
define('#cashier/base/1.0.1-dev/cashier.js', ['#casier/base/1.0.1-dev/base.js','#ar/jquery/1.7.2/jquery.js', '#ar/xbox/2.0/xbox.js', '#ar/widget/2.0/widget.js', '#ar/oo/2.0/class.js'], function(require, exports, module) {
var xbox = require('#ar/xbox/2.0/xbox.js');
var base = require('#cashier/1.0.1-dev/base.js');
var a = require('#cashier/1.2/security/a.js');
var b = require('#cashier/1.2/security/b.js');
exports.doSth = function() {
//.…..
};
});
//base.js被合并进来了.
define('#cashier/base/1.0.1-dev/base.js', ['#ar/jquery/1.7.2/jquery.js'], function(require, exports, module) {
var jquery = require('#ar/jquery/1.7.2/jquery.js');
exports.doSth = function() {
//.…..
};
});
/** personal.js **/
define('#cashier/base/1.0.1-dev/personal.js', ['/casier/base/1.0.1-dev/base.js', '/ar/underscore/0.9.2/underscore.js', '/ar/jquery/1.7.2/jquery.js'], function(require, exports, module) {
var _ = require('#ar/underscore/0.9.2/underscore.js');
var base = require('#cashier/1.0.1-dev/base.js');
exports.personal = function() {
//.…..
};
});
//base.js被合并进来了.
define('/cashier/base/1.0.1-dev/base.js', ['/ar/jquery/1.7.2/jquery.js'], function(require, exports, module) {
var jquery = require('/ar/jquery/1.7.2/jquery.js');
exports.doSth = function() {
//.…..
};
});
/** sites/下面的文件由于是资源文件, 没有变化. **/
把dist目录中的文件发布到相应位置即可. 比如在这里. 我们可以把dist中的目录传递到线上cashier/下面
seajs.use('/cashier/base/1.0.1{-dev}/base.js', function(base) {
base.cashier();
});
//
//在这里{-dev}在seajs.use的时候会去检查当前页面所在环境, 如果线上会-dev会被替换为'', 而在测试环境始终请求的是-dev.
// 其中需要理解的时候当1.0.1版本发布后这两个版本对应的模块文件是等价的(1.0.1-dev.js == 1.0.1.js)