SeaJs笔记
el：一个简单的班级管理，竟然要加载这么多脚本文件？
1、多个js文件可能有依赖关系，被依赖的文件需要早于依赖它的文件加载到浏览器
2、js加载的时候浏览器会停止页面渲染，加载文件越多，页面失去响应时间越长
一、为什么前端模块化？
-
避免变量污染，命名冲突
-
脚本的异步并行加载
-
依赖关系的管理
二、使用方法：
1、定义模块
1. define(function(){
2. alert('1111');
3. });
2、输出模块
1. define(function(require, exports){
2. exports.getStr = function(ss){
3. if(ss == '1'){
4. return '111';
5. }else{
6. return '222';
7. }
8. };
9. });
3、引用模块
1. define(function(require, exports){
2. var demo = require('./demo.js');
3. var str = demo.getStr('test');
4.
5. exports.msg = 'the res is:' + str;
6. });
4、使用模块
1. seajs.use('../demo03.js', function(aa){
2. alert(aa.msg);
3. });
三、与gulp的联合使用：
gulp-seajs-combine
//=====================压缩SeaJs文件========================//
gulp.task('jscombine', function () {
return gulp.src('./Scripts/Class/ClassSettingNew.js')
.pipe(seajs(null, {
except: ['jquery'] //强行排除
}))
.pipe(uglify({
mangle: {
reserved: ['require', 'exports', 'module', '$', 'jQuery', 'seajs']
}//排除混淆关键字
}).on('error', function (err) {
gutil.log("Error:" + err);
this.emit('end');
}))
.pipe(concat('ClassSettingNewSea.js'))
.pipe(gulp.dest('./Scripts/Class'));
});
