Home

Awesome

#modJS

简介

modJS是一套的前端模块加载解决方案。与传统的模块加载相比,modJS会根据产品实际使用场景,自动选择一种相应的方案,使最终的实现非常轻量简洁。

使用

模块的定义

使用define来定义一个模块:

define (id, factory)

在平常开发中,我们只需写factory中的代码即可,无需手动定义模块。发布工具会自动将模块代码嵌入factory的闭包里。

factory提供了3个参数:require, exports, module,用于模块的引用和导出。

require (id)

和NodeJS里获取模块的方式一样,非常简单。

因为所需的模块都已预先加载,因此require可以立即返回该模块。

require.async (names, onload, onerror)

names可以是一个模块名,或者是数组形式的模块名列表。

当所有都加载都完成时,onload被调用,names对应的所有模块实例将作为参数传入。

如果加载错误或者网络超时,onerror将被触发。

超时时间可以通过require.timeout设置,默认为5000(ms)。

使用require.async获取的模块不会被发布工具安排在预加载中,因此在完成回调之前require将会抛出模块未定义错误。

require.loadJs (url)

异步加载脚本文件,不做任何回调

require.loadCss ({url: cssfile})

异步加载CSS文件,并添加到页面

require.loadCss ({content: csstext})

创建一个样式列表并将css内容写入

##说明

modJS只实现了AMD的一个子集,如果需要使用完整兼容AMD规范的版本,请使用amd目录下的esl-mod.js,这个版本是基于esl版本基础之上实现了fis的需求。

相关项目

自动化框架:fis

自动添加define插件:fis-postprocessor-jswrapper