美文网首页
JS模块化(cmd)

JS模块化(cmd)

作者: 原来哥哥是万家灯火 | 来源:发表于2019-02-11 17:23 被阅读0次

AMD 是 RequireJS 在推广过程中对模块定义的规范化产出。
CMD 是 SeaJS 在推广过程中对模块定义的规范化产出。
cmd规范和amd规范基本类似,先总结seajs的用法,再回头看两者的些许区别。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<script src="js/sea.js"></script>
<script>
    seajs.config({
        alias: {
            "jquery": "jquery/jquery/1.10.1/jquery.js"
        }
    });

    // 加载入口模块
    seajs.use("./js/app");
</script>
</body>
</html>

define() 方法

定义模块
define方法可以传入一个函数作为参数,在函数中书写业务并暴露出本模块的参数,如果不需要,也可以不对外暴露参数。

// add.js

define(function (require, exports, module) {
    // require可用来加载依赖,exports和module可用来暴露模块参数,
    // 与commonjs一样,不能直接exports = ...,这会修改exports原来的指向
    module.exports = function (a, b) {
        return a + b;
    }
});

也可以直接传入你要暴露的参数,如:

// add.js

define(5555);
// define('床前明月光');
// define({ name: '赵绪琦'});

相当于:

define(function (require, exports, module) {
    module.exports = 5555;
});

require()方法

加载模块
seajs并没有专门提供一个可以直接调用的require方法,而是在define的函数中作为参数提供

define(function(require, exports, module) {
    let add = require('./add');
    console.log(add);
    
    // let oneModule = require('oneModule');
    // oneModule.doSomething()

    let poem = require.async('./poem', function () {
        console.log(poem);
    })
});

注意到上面例子中并没有像RequireJs一样,直接把需要加载的模块在一开始就写进define方法的参数中去,而是在函数内部执行require方法去加载。官方说的依赖就近应该意思是依赖就近书写:我的理解是在实际需要用到某模块是就近加载它。我想可能包含两层意思:

*打个比方:两个人修自行车。

  • amd是一开始就抱个装满工具的箱子出门,cmd是啥也不带就出门,需要用到螺丝刀就去屋里拿螺丝刀,需要扳手就去屋里那扳手。
  • 而且cmd是拿来了螺丝刀就马上做螺丝刀的事,拿来了扳手就马上做扳手的事。

而且cmd是拿来了螺丝刀就马上做螺丝刀的事,拿来了扳手就马上做扳手的事。这句话的意思是:

var a  = require('a');
a.doSomething();

var b  = require('b');
b.doSomething();

而不是:

var a  = require('a');
var b  = require('b');

a.doSomething();
b.doSomething();

区别

开发者的回答:

  • 定位有差异。RequireJS 想成为浏览器端的模块加载器,同时也想成为 Rhino / Node 等环境的模块加载器。Sea.js 则专注于 Web 浏览器端,同时通过 Node 扩展的方式可以很方便跑在 Node 环境中。
  • 遵循的规范不同。RequireJS 遵循 AMD(异步模块定义)规范,Sea.js 遵循 CMD (通用模块定义)规范。规范的不同,导致了两者 API 不同。Sea.js 更贴近 CommonJS Modules/1.1 和 Node Modules 规范。
  • 推广理念有差异。RequireJS 在尝试让第三方类库修改自身来支持 RequireJS,目前只有少数社区采纳。Sea.js 不强推,采用自主封装的方式来“海纳百川”,目前已有较成熟的封装策略。
  • 对开发调试的支持有差异。Sea.js 非常关注代码的开发调试,有 nocache、debug 等用于调试的插件。RequireJS 无这方面的明显支持。
  • 插件机制不同。RequireJS 采取的是在源码中预留接口的形式,插件类型比较单一。Sea.js 采取的是通用事件机制,插件类型更丰富。

config的配置项,

只要不用seajs的话,没必要深究了,大概了解cmd就行

相关文章

  • js模块化相关

    js模块化编程之彻底弄懂CommonJS和AMD/CMD!

  • js模块化规范

    一、js模块化1、模块化规范: script CommonJS AMD CMD ES6 modules 2、scr...

  • 06Vue的前端工程化

    Vue的前端工程化 一 模块化规范 1.1模块化规范举例 浏览器端JS模块化规范:AMD,CMD 服务器端JS模块...

  • 前端工程化的一些理解

    一、模块化 主要是js模块化,可以使用CommonJS、AMD、CMD等模块化规范,其中的区别是CommonJS对...

  • 一次性搞懂 CommonJS, AMD, CMD 等模块化规范

    1 常见的模块化规范 CommonJs (Node.js) AMD (RequireJS) CMD (SeaJS)...

  • JS模块化的发展历程

    JS模块化的发展历程 CommonJS、AMD、CMD、UMD、ES6模块化 模块化之前的引用方式 最开始的样子 ...

  • 模块化

    - 模块化 -AMD-CMD规范- requireJS实践- r.js打包工具使用 1、为什么要使用模块化?###...

  • 2-1、模块化

    一、JS模块化 (1)命名空间 (2)CommonJS (3)AMD (4)CMD (5)UMD (5)ESM (...

  • 浅析JS模块规范:AMD,CMD,CommonJS

    随着JS模块化编程的发展,处理模块之间的依赖关系成为了维护的关键。 模块化 AMD,CMD,CommonJS是目前...

  • JS模块化(cmd)

    AMD 是 RequireJS 在推广过程中对模块定义的规范化产出。CMD 是 SeaJS 在推广过程中对模块定义...

网友评论

      本文标题:JS模块化(cmd)

      本文链接:https://www.haomeiwen.com/subject/sjvqeqtx.html