Sea.js 使用总结(3)

模版引擎是渲染页面 模版加载器是书写js

sea.js 的配置

使用script标签引入sea.js，然后使用 seajs.use 进行配置 （sea.js下载  在dist 目录下）

seajs.use主要用于载入入口模块。入口模块是整个模块的根

一般seajs.use只用在页面载入入口模块，SeaJS会顺着入口模块解析所有依赖模块并将它们加载

如果如果模块只有一个，也可以通过给引入 sea.js 的script标签加入 data-main 属性来省略 seajs.use,例如上面的写法也可以改为如下：

<script  src="sea.js"  data-main="main.js"></script>

seajs.config(option)  用来进行配置的方法

当模块标识很长时，可以使用 alias 来简化。使用 alias 可以让文件的真实路径与调用路径分开，有利于统一维护

当目录较深，或者需要跨目录来调用模块时，可以使用 paths 来简化书写。paths 配置结合 alisa 配置一起使用，让模块引用非常方便

有些场景下，模块路径在运行时才能确定，这时可以使用 vars 变量来配置。vars 配置的是模块标识中的变量值，在模块标识中使用 {key} 表示变量

map Array 该配置可以对模块路径进行映射修改，可用于路径转换、在线调试等。

preload Array  可以在普通模块加载前，提前加载并初始化好指定的模块

debuge Boolean  值为true时，加载器不会删除动态插入的script标签。插件也可以根据 debuge 配置，来决策 log 等信息的输出

base String  sea.js在解析顶级标识时，会相对 base 路径来解析

*** 注意：一般不用配置base路径，把sea.js放在合适的路径往往更有效

charset String | Function  获取模块文件时

模块的定义及编写

seajs中使用 define 函数来定义一个模块，define 可以接收三个参数（不知道是哪三个）

define 对于不同参数个数的解析规则如下：

如果只有一个参数，则赋值给 factory

如果有两个参数，第二个赋值给 factory；第一个如果是 array 则赋值给 deps，否则赋值给 id

如果有三个参数，则分别赋值给 id，deps和factory。

但是，包括 SeaJS 的官方示例在内几乎所有用到 define 的地方都只传递一个工厂函数进去，类似写法如下：

define(function(require,exports,module){

         // 写入代码

})

推荐遵循 SeaJS 官方示例的标准，用一个参数的 define 定义模块。那么 id 和 deps 怎么处理呢

id 是一个模块的标识字符串，define只有一个参数时，id会被默认赋值为此 js 文件的绝对路径。

如 example.com下的 a.js 文件中使用 define 定义模块，则这个模块的 id 会被赋值为 http://example.com/a.js，没有特别的必要建议不要传入id

deps 一般也不需要传入，需要用到的模块用 require 加载即可

工厂函数 factory 解析

工厂函数是模块的主体和重点。在只传递一个参数给 define 时(推荐写法)，这个函数就是工厂函数，此时工厂函数的三个参数分别是：

require  ---  模块加载函数，用于记载依赖模块

exports  ---  接口点，将数据或者方法定义在其上则将其暴露给外部调用

module  ---  模块的元数据

这三个参数可以根据需要选择是否需要显示指定

module是一个对象，存储了模块的元信息，具体如下：

module.id   ----  模块的id

module.dependencies  ----  一个数组，存储了此模块依赖的所有模块的id列表

module.exports   ----  与exports指向同一个对象

三种编写模块的模式：

最后写一个简单的小 demo：

helloworld.html:

main.js: