seajs

1、模块化配置信息 seajs config
用于配置seajs的一些选项参数，接受一个对象，该对象的属性值就是咱们的配置项目
配置信息基本语法：
在seajs.use()上边：

seajs.config({

alias:{},

paths:{}

})

　　

1.alias定义模块别名
当咱们在项目中引入一些基础类库，常常会涉及到类库的版本升级问题，才是每一个模块都引入了类库，那么升级就须要修改每一个模块中的名字，风险比较大，
若是使用alias定义这个模块（类库）、使用别名调用，更新只须要更新版本号，就能够作到全局更新
eg:
jq:jquery-1,12.2.min.js
全部模块中都使用jq，若是我将这个版本改成jq:jquery-1.5.min.js
全部使用了jq的模块中的jquery都会变为1.5的版本

2.paths 路径配置
当模块目录比较深的时候，或者须要跨目录调用模块时，可使用paths简化路径
也可使用{}匹配语法调用变量（vars）

eg:
require('header/skin/top/top')
===>
paths:{
h:'header/skin/top'
}
require('h/top');

 

3.vars 声明变量
有些场景下，模块路径在运行时才能肯定（动态处理），这是可使用vars变量来配置
若是模块开发时路径比较复杂，也可使用vars进行简化路径，将路径的一部分定义为变量，使用{}进行拼接，与paths有点相似

 

4.map 映射处理
该配置可对模块路径进行映射修改，可用于路径转换，在线调试等
当模块开发时，咱们使用的文件名字进行调用，此时文件并无被压缩，当开发结束，文件进行了压缩，文件名字发生了变化，此时在调用没压缩的是名字会报错，此时经过map进行映射处理，找到这些文件，修改对应的文件名
map是数组

eg：
文件：mian.js
调用：require('mian')
文件压缩：main.min.js
配置：map：['main.js','main.min.js']
调用：require('main')
map:['.js','.min.js']

 

5.base根路径
sea.js在解析顶级标识时，会相对base路径来解析
sea.js所在的目录为默认的根目录，可是使用base可自行手动设置根目录

 

6.charset 设置字符集（编码方式）
用于设置模块的编码方式

 

7.debug调试模式
值为true，标识加载器不会删除动态插入的
script标签，插件也能够根据debug配置来决定log等信息输出

 

8.preload 预加载
使用preload配置项，能够在普通模块加载前，提早加载1并初始化好某个特定的模块
预加载的模块能够在全局模块下直接使用，不须要引入
使用preload预加载须要在sea.js下引入sea-preload.js

 

9.css 加载css文件
若是须要在模块中生成html标签，并使用css样式，可使用css加载这些css文件
须要引入文件：seajs-css.js
任何模块引入的css文件都将会在全局发挥做用，不须要单独引入

 

10.requirejs
1.简介：

地址：http://www.requirejs.org.cn/
github：https://github.com/requirejs/requirejs
npm安装 ： npm i requirejs

 

requirejs也是一种模块化开发依赖管理的代码工具，与seajs有着类似的api，但也有不一样之处，requirejs与seajs的区别：
1）seajs引入的默认根目录是sea.js文件所在的目录，可是requirejs的根目录是引入require.js文件的html文件所在的目录
2）在模块内部引入其余模块，seajs依然是对seajs文件所在的根目录为基础写路径，可是requirejs则是相对当前文件所在位置为基础写路径
3）seajs能够对define定义模块传递一个字符串为参数来定义一个字符串模块，可是requirejs不容许

2.模块定义 define
与seajs对比：
1）不能单独写一个字符串或数字
2）能够传递一个对象，对象模块
3）能够传递一个函数（commonjs规范），参数同样

module不同：
1）id表示模块id，id没有后缀，seajs有后缀
2）没有依赖集合
3）config配置不一样

相同点：
1）uri是同样的
2）exports是同样的
4）传递两个参数时，第一个参数表示依赖模块集合数组，第二个参数时模块主体数组，函数的参数表示前边依赖集合所引入的内容，顺序是引入依赖的顺序

 

requirejs模块调用：
1）html文件中须要引入根文件（不是模块）
<scritp src='../require.js' data-main='./js/app.js'></script>

app.js就是一个单纯的js文件（根文件），不是模块
2）根js文件或子模块中引入其余模块
require(['./header/header','./header/skin/skin'],function(h,s){
//h表示1header返回内容。s表明skin返回内容
})

3）子模块中引入其余模块
define(['./header/header','./header/skin/skin'],function(h,s){
//h表示1header返回内容。s表明skin返回内容
})

4）子模块中引入其余模块，define1个参数
define(function(require,exports,module){
var h=require('header/header');
})