SeaJS 是一个遵循 CMD 规范的模块化加载框架

CommonJS,CMD,AMD等规范后文会提到,这里主要先了解如何在代码中使用。

如果你有使用过nodejs ,那么理解起来就容易多了。

我们通过sea.js来加载我们定义的模块(这会儿遵循CMD规范)并使用相应的数据。

首先,当然是要下载sea.js,可以直接去http://seajs.org/docs/#downloads 直接下载代码包,解压后 在 /dist/目录下可以 找到 sea.js

CMD规范是懒加载,按需加载,也就是在require的时候相应的模块才会被加载进来。

基本用法为:

define(function(require, exports, module) {

  // The module code goes here
 // require .. });

CMD详细用法见此

举个例子:(为了简单说明,暂时先直接置于同一目录)

index.html是主界面,main.js这里充当了主模块文件(一般需要 seajs.use('.main') 的方式来加载主模块),然后主模块main又调用main1,main2小模块,理解执行过程。

index.html:

首先包含资源sea.js ,再包含主模块,这里因为要执行主模块中返回的数据,所以使用了回调函数的处理

<!DOCTYPE html>
<html>
<head>
<title>Seajs</title>
<style type="text/css">
</style>
</head>
<body> <script type="text/javascript" src="./sea.js"></script>
<script type="text/javascript">
//加载入口文件main.js,默认后缀js自动匹配
seajs.use('./main',function(main){
console.log(main.say());
});
</script>
</body>
</html>

main.js:

这里,main.js定义了一个模块main.js ,在其中又require其他模块进行处理,然后返回一个对象。

返回的时候可以直接使用return,类型会自动判断,也可以module.exports =

比如想返回 ‘w' ,可以直接 return ’w'; 或 module.exports = 'w'; index那里相应做一下修改就行。

define(function(require,exports,module){
console.log('module of main:');
var main1 = require('main1');
main1.say();
var main2 = require('main2');
main2.say(); return {
say: function(){
console.log('main--hello');
}
}; });

main1.js:

define(function(require,exports,module){
console.log('module of main1:'); module.exports = {
say: function(){
console.log('main1--hello');
}
};
});

main2.js:

define(function(require,exports,module){
console.log('module of main2:'); return {
say: function(){
console.log('main2--hello');
}
};
});

ok 浏览器访问index.html 即可看到执行结果:

SeaJS 模块化加载框架使用的更多相关文章

  1. seajs模块化加载框架使用

    seajs是模块化加载框架.seajs.org已经打不开了,seajs的github.seajs速查文档 <!--如果完成下面4步,则seajs掌握了80%js模块化1.引入seajs的库 :& ...

  2. RequireJS 模块化加载框架使用

    RequireJS 是一个遵循 AMD 规范的模块化加载框架 与上文seajs一样,这里简单介绍其相关用法 同样的,首先是下载好 require.js --> http://requirejs. ...

  3. RequireJS与SeaJS模块化加载示例

    web应用越变的庞大,模块化越显得重要,尤其Nodejs的流行,Javascript不限用于浏览器,还用于后台或其他场景时,没有Class,没有 Package的Javascript语言变得难以管理, ...

  4. 转: javascript模块加载框架seajs详解

    javascript模块加载框架seajs详解 SeaJS是一个遵循commonJS规范的javascript模块加载框架,可以实现javascript的模块化开发和模块化加载(模块可按需加载或全部加 ...

  5. javascript模块加载框架seajs详解

    SeaJS是一个遵循commonJS规范的javascript模块加载框架,可以实现javascript的模块化开发和模块化加载(模块可按需加载或全部加载).SeaJS可以和jQuery完美集成,使用 ...

  6. angularJS1笔记-(20)-模块化加载机制seajs

    SeaJS是一个遵循CMD规范的JavaScript模块加载框架,可以实现JavaScript的模块化开发及加载机制. 与jQuery等JavaScript框架不同,SeaJS不会扩展封装语言特性,而 ...

  7. js模块化加载器实现

    背景 自es6以前,JavaScript是天生模块化缺失的,即缺少类似后端语言的class, 作用域也只以函数作为区分.这与早期js的语言定位有关, 作为一个只需要在网页中嵌入几十上百行代码来实现一些 ...

  8. 一起写一个Android图片加载框架

    本文会从内部原理到具体实现来详细介绍如何开发一个简洁而实用的Android图片加载缓存框架,并在内存占用与加载图片所需时间这两个方面与主流图片加载框架之一Universal Image Loader做 ...

  9. 该如何理解AMD ,CMD,CommonJS规范--javascript模块化加载学习总结

    是一篇关于javascript模块化AMD,CMD,CommonJS的学习总结,作为记录也给同样对三种方式有疑问的童鞋们,有不对或者偏差之处,望各位大神指出,不胜感激. 本篇默认读者大概知道requi ...

随机推荐

  1. Drupal7_2:安装drupal

    Drupal7_2:安装drupal 分类: Drupal72012-10-30 01:06 1074人阅读 评论(0) 收藏 举报 假设你已经搭建好了所需的必备环境,接下来就参照以下几步,快速安装一 ...

  2. 源代码安装 MySQL 5.6.28

    本文内容 创建 MySQL 用户和组 解压 MySQL 源代码包 生成配置安装文件 编译和安装 MySQL 配置文件 创建 MySQL 授权表 MySQL 目录授权 启动 MySQL 验证 MySQL ...

  3. RS开发中的一些小技巧[不定期更新]

    从9月份一直忙到了现在,项目整体的改版工作也完成了十有八九了,有些事情只有你自己真正的做了,你才能明白:哦,原来还可以这个样子,这样做真的好了很多呢,接下来我就分享一些最近遇到的RS开发的一些小技巧, ...

  4. Navi.Soft30.开放平台.百度.开发手册

    1系统简介 1.1功能简述 现在是一个信息时代,并且正在高速发展.以前获取信息的途径非常少,可能只有电视台,收音机等有限的来源,而现在的途径数不胜数,如:QQ,微信,官方网站,个人网站等等 本开发手册 ...

  5. DRY原则和Shy原则

    保障可维护性的主要诀窍是遵循DRY原则和Shy原则. 在一个系统的整个生命周期里,理解和改动这类维护工作的比例一般非常之高.为了维护的方便,要尽量将系统划分为可以独立理解与改动的模块.这就要在设计的时 ...

  6. Android studio NDK 编译 "$USE_DEPRECATED_NDK=true" 异常问题解决

    我的项目是https://github.com/leixiaohua1020/simplest_ffmpeg_mobile/tree/master/simplest_ffmpeg_android_st ...

  7. mongodb_查询操作使用_条件查询、where子句等(转)

    <?php /*  mongodb_查询操作使用_条件查询.where子句等(转并学习)   1.find()/findOne() mongodb数据库的查询操作即使用find()或者findO ...

  8. WinDbg 命令集锦

    //断点相关 bp + 地址 设置断点bl  显示已经设定的断点bu + 地址 设置断点,但是这种类型断点再下一次启动时被记录bc 清除断点对于断点范围,可以用*匹配,-表示一个范围,表达多个可用,号 ...

  9. [原创]Android系统中常用JAVA类源码浅析之HashMap

    由于是浅析,所以我只分析常用的接口,注意是Android系统中的JAVA类,可能和JDK的源码有区别. 首先从构造函数开始, /** * Min capacity (other than zero) ...

  10. pentaho saiku 安装全过程

    公司希望也开发一套多维分析系统,以解决运营/产品无休止的需求和技术人力不足的矛盾! 一.开发选型: 一.BIRT:易用性差,所以没再使用 二.JasperReport+ireport:文档收费,不支持 ...