SeaJs模块化加载

最新推荐文章于 2020-12-24 09:50:13 发布

RaylnGuan

最新推荐文章于 2020-12-24 09:50:13 发布

阅读量151

点赞数

本文链接：https://blog.csdn.net/rayln/article/details/39153323

版权

SeaJs模块化加载, 这个是国人写的一个框架, 遵循CMD模块准则. 目的是整个项目模块化.
也可以有效的减少数据的加载量.
直接看例子:

注意. 这里的Jquery需要模块化, 是需要一点改造!!
改造也很简单:

define(function(){
	/*! jQuery v1.7.2 jquery.com | jquery.org/license */
        /*
        jquery源码!!
        */

        //最后的返回是关键, 让SeaJs把jquery的$纳入模块化中
	return $;
});

require: 调用外部模块的对外方法
exports: 声明该模块的对外方法
module: 用于表示当前模块的信息，具有如下属性:
        id:      模块的唯一表示， require方法需要用到他
        exports: 当前模块开放的接口, Object
        dependencies: 当前模块的依赖列表

一个hello.js文件, 一个模块

define(function(require, exports, module){
	var $ = require("jquerymin");
	exports.sayhello = function(){
		alert("helloworld");
	};
});

一个hello.html.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<script type="text/javascript" src="lib/sea.js"></script>
</head>
<body>
<button id="helloworld">helloworld</button>
</body>
</html>
<script>
seajs.config({
	alias: {
		'jquerymin': './lib/jquery.js'
	}
});

seajs.use(['./hello','jquerymin'], function(hello, jquery){
	jquery("#helloworld").click(function(){
		hello.sayhello();
	});
});
</script>

RaylnGuan

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
SeaJs模块化加载

SeaJs模块化加载, 这个是国人写的一个框架, 遵循CMD模块准则. 目的是整个项目模块化.也可以有效的减少数据的加载量.直接看例子:注意. 这里的Jquery需要模块化, 是需要一点改造!!改造也很简单:define(function(){ /*! jQuery v1.7.2 jquery.com | jquery.org/license */ /*
复制链接

扫一扫