今天刚接触到js的模块化编写，就去了解了下seajs。找了好多都没有找到实际的例子，只有seajs官方gibhub上文档，但是又不是很详细，对于一个新接触到模块化的人来说我觉得有点难懂，所以找了个实际例子，来消化seajs。例子是来自脚本之家，修正了一些错误。
1.index.html——主页面。
2.sea.js——SeaJS脚本。
3.init.js——init模块，入口模块，依赖data、jquery、style三个模块。由主页面载入。
4.data.js——data模块，纯json数据模块，由init载入。
5.jquery.js——jquery模块，对 jQuery库的模块化封装，由init载入。
6.style.css——CSS样式表，作为style模块由init载入。
7.sea.js和jquery.js的代码属于库代码，就不赘述，这里只给出自己编写的文件的代码。
首先是index.html文件
<!DOCTYPE html>
<html>
<head>
<title>seaJS</title>
<meta charest= "utf-8">
</head>
<body>
<div id = "content">
<p class= "author"></p>
<p class = "blog"><a href = "#">Blog</a></p>
</div>
<script src = "./sea.js"> </script>
<script>
seajs.use('./init');
</script>
</body>
</html>不知道为什么使用一直不行，还在解决中。。。。
init.js
define(function(require, exports, moudle){
var $ = require('./jquery');
var data = require('./data');
var css = require('./style.css#');
$('.author').html(data.author);
$('.blog').children('a').attr('href',data.blog);
});
data.js
define({
author: 'zhangxin',
blog: 'http://www.csdn.net'
});
style.css
.author
{
color:red;
font-size:10px;
}
.blog
{
font-size:10px;
}这样直接运行，css文件可以调用出来，但是要报错，不知道为什么，如果有人知道，可以指出来。
注意点：
1、var css = require(‘./style.css#’);因为seajs在调用文件的时候会自动加上.js后缀，在调用css文件的时候需要在文件路径后加上#就不会自动加上后缀。
2、如果调用文件过多，可以使用
seajs.config({
base: '',
alias: ''
})还有seajs中的exports和module还在熟悉中，但是用法应该比较简单。
373
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
