seajs是模块化加载框架。seajs.org已经打不开了,seajs的githubseajs速查文档

<!--如果完成下面4步,则seajs掌握了80%
js模块化
1.引入seajs的库 :<script type="text/javascript" src="sea/sea.js"></script>
2.如何变成模块
define:一个文件就是一个模块。如下utils文件

define(function(require, exports) {
exports.each = function (arr) {
// 实现代码
}; exports.log = function (str) {
// 实现代码
};
});

3.如何调用模块 exports seajs.use

用来在页面中加载一个或多个模块。seajs.use(id, callback?)
4.如何依赖模块 requie

通过 require('./util.js') 就可以拿到 util.js 中通过 exports 暴露的接口。

require执行完的结果就是exports 。
-->

html文件:

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no"/>
<meta name="format-detection" content="telphone=no, email=no"/>
<meta name="apple-touch-fullscreen" content="yes"/>
<meta name="apple-mobile-web-app-capable" content="yes"/>
<meta name="apple-mobile-web-app-status-bar-style" content="black"/>
<title>image-size</title>
<style type="text/css">
*{margin: 0;padding: 0;}
</style>
<script type="text/javascript" src="sea/sea.js"></script>
<script language="javascript">
//加载入口文件main.js,默认后缀js自动匹配
//seajs.use(模块地址,函数)
// sea的默认根目录:sea.js这个文件所在的文件
//以当前页面为根目录写法:./目录
seajs.use('./sea/main',function(main){
console.log(main.say());
});
</script>
</head>
<body> </body>
</html>

与html并列的sea文件夹里,放有sea.js,main.js,main1.js,main2.js

main.js:

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

main1.js:

define(function(require,exports,module){
console.log('module of main1:');
//exports 对外提供接口的对象
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');
}
};
});

输出结果:

module of main:
module of main1:
main1--hello
module of main2:
main2--hello
main--hello
undefined

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

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

    SeaJS 是一个遵循 CMD 规范的模块化加载框架 CommonJS,CMD,AMD等规范后文会提到,这里主要先了解如何在代码中使用. 如果你有使用过nodejs ,那么理解起来就容易多了. 我们通 ...

  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. EF Core MySql GUID配置方式

    builder.Property(m => m.Id) .HasColumnName("Id") .ForMySQLHasColumnType("char(36)& ...

  2. Gridview基础

    gridview是封装好的,直接在设计界面使用,基本不需要写代码 1.绑定数据源 GridView最好与LinQDatasourse配合使用,相匹配绑定数据: 2.外观控制—— 点开有自动套用格式 布 ...

  3. 我也质疑下petshop

           很多人都研究过petshop,我开始认识分层架构也是从研究这个petshop开始的.但是我发现很多人一谈三层架构就是 petshop那一套东西.实体类,DAL,BLL那一套东西.首先我不 ...

  4. 初识react中的状态量

    react组件中的两类状态数据:props,state,官网API给出的使用规范,多读几遍,受益匪浅: 结论: 1. 对应任何可变的数据,理应只有一个单一“ 数据源 ” 2. 如果多个组件均需要这些数 ...

  5. java 设计模式 之 桥梁模式

    桥梁模式:将抽象和实现解耦,使两者可以独立的变化.解释:将两个有组合关系,强耦合的对象,各自抽象然后解耦.(类关系图看https://www.cnblogs.com/blogxiao/p/951388 ...

  6. Java jar包查询下载方法

    做过java开发的工程师,对java应用所需jar包一定不会陌生.特别是有需要搭建开发环境时,对各种jar包的需求量就会很大. 如何快速的找到自己想要的jar包,是蛮多java工程师所面临的一个难题. ...

  7. FusionCharts3.2.1 参数的详细说明和功能特性

    功能特性animation                    是否动画显示数据,默认为1(True)showNames                 是否显示横向坐标轴(x轴)标签名称rotat ...

  8. iOS上线check_list

    iOS 上线前 check_list 类型 序号 检查项 结果(pass/no) 安装 卸载 1 非越狱环境下的安装.卸载 2 越狱环境下的安装.卸载 3 安装文件检查,无泄漏用户信息的隐患 4 卸载 ...

  9. 洛谷 P2947 [USACO09MAR]仰望Look Up

    题目描述 Farmer John's N (1 <= N <= 100,000) cows, conveniently numbered 1..N, are once again stan ...

  10. 由DAG到背包问题——记忆化搜索和递推两种解法

    一.问题描述 物品无限的背包问题:有n种物品,每种均有无穷多个.第 i 种物品的体积为Vi,重量为Wi.选一些物品装到一个容量为 C 的背包中,求使得背包内物品总体积不超过C的前提下重量的最大值.1≤ ...