node package manager
Painless code sharing. npm Orgs help your team discover, share, and reuse code. Create a free org »

webkit-dwarf

webkit-dwarf

build status

What the Fuck?

短小精悍的webkit浏览器Javascript模块加载器。

Why?

  • 许多客户端(如:QQ、微信)有基于webkit内核的内嵌浏览器
  • 手机端流量非常重要,需要极小的模块管理库
  • 基于线下构建,可以带来更好的编程体验

Goal

  • 足够小,gzip之后小于1k
  • 旨在配合线下构建工具,带来更好的编程体验,例如源代码是这样写的:

src/main.js

require(function () {
    var test = require('./test');
    // do something
});

src/test.js

define(function (require, exports, module) {
    var util = require('./util');
    // do something
    exports.result = 'test';
});

构建后则: dist/main.js

require(['./test'], function () {
    var test = require('./test');
    // do something
});

dist/test.js

define('./test', [./util], function () {
    var util = require('./util');
    // do something
    exports.result = 'test';
});

模拟接近于NodeJS的编程体验。

API

  • 异步加载

    #### require(modules, success, fail)

    modules Array 异步加载的模块数组

    success Function 成功回调

    fail Function 失败回调

    例如:

require(['./test'], function () {
    // do something
}, function () {
    throw new Error('Failed to load module');
});
  • 同步获取

    ### require(module)

    module String 要获取的模块名

    返回 对应模块

    例如:

require(['./test'], function () {
    var test = require('./test');
    // do somthing
}, function () {
    throw new Error('Failed to load module');
});
  • 定义模块

    ### define(module, dependencies, factory) ### define(module, factory) ### define(module, value)

    module String 模块相对该js文件对应路径,因为有可能在一个js文件中定义多个模块

    dependencies Array 依赖数组

    factory Functino 模块初始化工厂

    value String, Number or Object 模块值

    例如:

define('./test', [./util], function (require, exports, module) {
    var util = require('./util');
    // do something
    exports = module.exports = {
        result: 'test'
    };
});
  • 设置require

    ### require.opt(opts)

    必须在第一次使用require前设置。

    opts Object 设置内容

    例如:

require.opt({ base: 'http://qun.qq.com/js/' });
  • 定制require

    ### require.makeRequire(opts)

    opts Object 设置内容

    返回 对应的require实例

    例如:

var myRequire = require.makeRequire({ base: 'http://qun.qq.com/js/' });

应用项目

  • 群公告PC版
  • 群公告手Q版