SesJs

①引入sea.js的库
<script type="text/javascript" src=‘sea/sea.js‘></script>

②如何变成模块？define

//sea下的参数，是不允许修改的。参数的名固定
//
// model1.js
define(function(require, exports, module) {		
	
	// 通过 exports ： 对外提供借口的对象；
	// require ： 模块之间的接口依赖；
	// 这样就可以引入 其他模块内的 exports导出的对象；
	// 而模块3中，使用exports，来导出对应的模块。导出的是一个对象。
	
	var A = require(‘./model3.js‘);

	function show () {
		alert(A.a);			// 100
	}

	exports.show = show;
});

// model2.js
define(function (require, exports, modlue) {

	var a = 100;

	exports.a = a;		// 导出模块

})

③如何调用模块？exports seajs.use
	
	// 这里默认根目录是根据 sea.js的目录做为的。这里就引入不进来了。
	// http://127.0.0.1/osye/sea/sea/js/model1.js"
	// seajs.use("js/model1.js");
	// 记得 ./ 从当前目录开始应用
	// 以当前页面为根目录。
	// use 的方法，就是使用sea的 方法
	// 有2个参数，第一个是：模块的地址，第二个是加载好的回调函数。
	// 回调函数里面有参数，比如名叫 ex , 就是	模块内部定义的exports
	// 很容易的结局了冲突的问题。不同的模块也可以有相同的同名函数。
	// 这两个 ex 是不同的对象。
	
	seajs.use("./js/model1.js","./js/model2.js" function (ex1, ex2) {
		ex1.show();		// 第一个模块
		ex2.show();		// 第二个模块
	});

	seajs.use("./js/model2.js", function (ex) {
		ex.show();
	});


④如何依赖模块？require

	var A = require(‘./model3.js‘);




大体上4个步骤，引入sea.js脚本。然后define模块，
在定义的模块内可以嵌套其他模块，通过exports 和 require 来导出和引入。

产生模块化开发的由来是因为node的出现，用js来代替其他语言做服务器开发。
因此就产生了commonJs的组织，专门规定服务器端开发规范的。

服务器和浏览器的js有很多不同。模块化开发有很多问题。

浏览器开发规范：
	AMD规范：requireJS， 
	CMD规范：seaJS， 升级了commonJS


grunt  
安装流程先安装nodejs和npm(包管理工具)
sodu npm install -g grunt-cli
sodu npm install grunt --save-dev
grunt –version


grunt要配置package.json

grunt 合并的时候，define 多出2个参数。专门解决合并操作的。
	第一个：当前模块的ID ［‘./main.js‘］
	第二个：依赖模块的数组 ［‘./js/model1.js‘, ‘./js/model2.js‘ ...］
node install
module.exports = function(grunt) {
	// 配置
	grunt.initConfig({
		 pkg: grunt.file.readJSON(‘package.json‘),
		 concat : {
			 // 任务的名字
			 webqq : {
				 // 合并文件
				 files : {
					 ‘test/main.js‘ : [‘a.js‘,‘b.js‘,‘c.js‘,‘d.js‘]
				 }
			 }
		 },
		 uglify : {
			 webqq : {
				 files : {
					 ‘test/main.min.js‘ : [‘test/main.js‘]
 				 }
			 }
		 }
	});
	
	//  加载, 依赖
	grunt.loadNpmTasks(‘grunt-contrib-concat‘);
	grunt.loadNpmTasks(‘grunt-contrib-uglify‘);

	// 运行插件
  	grunt.registerTask(‘default‘, [‘concat‘,‘uglify‘]);
};
这样可以满足合并之后，依旧可以使用。
安装这个2个插件。
	Seajs + gruntjs开发
		grunt-cmd-transport
		grunt-cmd-concat

配一下grunt的参数可以，提取依赖，压缩合并模块。


配置信息
	alias    :  别名配置
	paths    :  路径配置
	vars     :  变量配置
	map      :  映射配置
	preload  :  预加载项
	debug    :  调试模式
	base     :  基础路径
	charset  :  文件编码


module
	(1）id  :  模块唯一标识
		alert(modlue.id);	//modlue是第三个参数，id的结果是文件目录。
		// http://127.0.0.1/js/model3.js

	(2)uri  :  模块绝对路径
		alert(modlue.uri); 	// http://127.0.0.1/js/model3.js

	(3)dependencies  :  当前模块依赖
		数组，require的。


	(4)exports  :  当前模块对外接口
		alert(module.exports == exports);		//true
		这里可以用module.exports = {
			....
		}
		向外导出对象。提供接口，或者属性。

	(5)require.async 异步加载模块

		require.async(‘./model3.js‘);	// 异步加载


插件 github看一下
	text
	style
	combo
	flush
	debug
	log
	health
	
		spm build



技巧
	（1）use 如何引入多模块
		seajs.use("./js/model1.js","./js/model2.js" function (ex1, ex2) {
			ex1.show();		// 第一个模块
			ex2.show();		// 第二个模块
		});

	（2）Sea.js加ID有利提取 
		<script type="text/javascript" src=‘sea/sea.js‘ id=‘seaJsId‘></script>

	（3）如何改造文件为CMD模块
		//普通的模块，define 写一个接口, 用exports 导出一个对象就好了。
		define(function(require, exports, module) {		
			
			var a = require(‘./model3.js‘);

			function show () {
				alert(a.a);
			}

			exports.moduleA = {
				show : show,
				   a :a
			}
		});


	（4）调试接口cache
		seajs.cache	 在浏览器输入

		Object {http://127.0.0.1/js/model1.js: c, http://127.0.0.1/js/model2.js: c, http://127.0.0.1/js/model3.js: c}
			http://127.0.0.1/js/model1.js: c
			http://127.0.0.1/js/model2.js: c
			http://127.0.0.1/js/model3.js: c
			__proto__: Object
			...
		｝