简单总结sea.js 学习
文件目录结构
/sea/sea.js 下载地址 http://seajs.org/docs/#downloads
/sea/jquery-sea.js 下载地址 http://jquery.com/download/
/sea/sea_config.js
/sea/home.jsdata.js
/sea/data.js
1.html页面代码文件
<style>
.ch{height:200px;width:200px;background:#ccc;}
</style>
<div class="cl"></div>
<!-- 引入sea.js文件 -->
<script src="/sea/sea.js"></script>
<!-- 引入sea_config.js配置文件 -->
<script src="/sea/sea_config.js"></script>
<script type="text/javascript">
seajs.use(['jquery','home'],function(a,b){ //
alert(b.foo); //调用home中的foo属性
b.init(); //调用home中的init接口
b.all(); //调用home中的all接口
})
</script>
2.sea_config.js配置文件
seajs.config({
// 别名配置
alias: {
'jquery': '/sea/jquery-sea',
'home': '/sea/home',
'data': '/sea/data'
},
// 路径配置
//paths: {
// 'gallery': 'https://a.alipayobjects.com/gallery'
//},
// 变量配置
//vars: {
// 'locale': 'zh-cn'
//},
// 映射配置
//map: [
// ['http://example.com/js/app/', 'http://localhost/js/app/']
//],
// 预加载项
//preload: ['jquery','home'],
// 调试模式
debug: true,
// Sea.js 的基础路径
//base: 'http://example.com/path/to/base/',
// 文件编码
charset: 'utf-8'
});
3.home.js模块文件
define(function(require, exports, module){
var data = require('data'); // 加载data模块 data.js
function wo(){ //内部函数，init中调用
alert("load $");
};
alert(data.blog); //直接执行函数
module.exports = { //当前模块对外提供的接口
foo:'hello', //属性
init : function(){ //接口init
wo(); //执行内部函数
$(".cl").addClass("ch");
},
all : function(){ //接口all
alert(data.author);
}
};
console.log(require.resolve('jquery')); //require.resolve返回别名文件 解析后的绝对路径
});
4.data.js模块文件
define({
author: 'ZhangYanpo',
blog: 'http://www.ktuo.cn'
});