Web 前端模块化框架:BrowserRequire
jopen
10年前
BrowserRequire 是给浏览器使用的模块化框架,并且提供灵活加载js文件(非模块化文件)的功能。
中文使用指南:点击进入!
目录介绍
dist————BrowserRequire框架压缩文件
example————示范案例
src————BrowserRequire源代码
要使用BrowserRequire只需要下载dist内的文件即可。
编写目的
在过去的Web开发中,遇到现有的模块化框架无法满足的需求,故开发一款更符合浏览器使用的模块加载器;
编写BrowserRequire目的不在于统一前后端模块使用,而是做一款更适合Web前端开发需求的模块化框架;
更好的处理了模块与非模块间的使用;
更像是LABjs+requireJS的结合增强版,但打包源文件只有7kb左右;
已知兼容性
IE 5.5+ (添加ieload插件,若不添加则IE10+)
Opera 10+
Chrome 8+
Firefox 3.6+
Safari 5+
其中Chrome、Firefox和Safari可能会向更前的版本兼容。
对移动端有很好的兼容性。
从功能上看更像requirejs和LABjs的结合体,拥有更实用的功能;
require('js/moduleA')
和requirejs一样,实用require指令导入模块或文件,但是相关参数和使用方法不一样;
require指令是确保文件只会载入一次;
添加多个模块和响应
//BrowserRequire require('js/moduleA','js/moduleB').ready = function(a,b){ console.log(a); console.log(b); };
和requirejs对比:
//requirejs require(['js/moduleA','js/moduleB'],function(a,b){ console.log(a); console.log(b); })
并且添加多种响应支持
//BrowserRequire var r = require('js/moduleA','js/moduleB','js/moduleC'); r.ready = function(a,b,c){ ... } r.loading = function(e){ console.log(e); } r.error = function(e){ console.error(e) }
还有很好的处理了非模块文件间的依赖,可以异步的按顺序添加文件或模块
//BrowserRequire require('js/jquery').require('js/jquery-widget').require('js/jquery-widget-search');
同时BrowserRequire模块依赖也支持该引入模式和各种响应
//BrowserRequire Module define(function(require){ var reObj = {}; require('moduleA').ready = function(a){ reObj.a = a; }; return reObj; })
模块的定义事件,会等依赖模块都加载完,才会做定义;
并且模块也可以依赖非模块文件;(非必要情况下不推荐这样做)
//BrowserRequire Module define(function(require){ var reObj = {}; require('moduleA','jquery').ready = function(a){ reObj.a = a; }; return reObj; })
还有更多功能请参考使用文档。