美文网首页
amd cmd commonjs es6

amd cmd commonjs es6

作者: 自you是敏感词 | 来源:发表于2018-01-27 22:28 被阅读0次

    amd      requirejs   dojo

    cmd       seajs

    commonjs    node              browserify  webpack

    CommonJS 加载模块是同步的,所以只有加载完成才能执行后面的操作。像Node.js主要用于服务器的编程,加载的模块文件一般都已经存在本地硬盘,所以加载起来比较快,不用考虑异步加载的方式,所以CommonJS规范比较适用。但如果是浏览器环境,要从服务器加载模块,这是就必须采用异步模式。所以就有了 AMD CMD 解决方案。

    RequireJS 是一个前端的模块化管理的工具库,遵循AMD规范,它的作者就是AMD规范的创始人 James Burke。所以说RequireJS是对AMD规范的阐述一点也不为过。

    In 2015, RequireJS is one of 3 major options on the module loading scene, along withBrowserifyandWebpack

    Browserify is an attempt to build a module loader on top of the NPM ecosystem and node modules. It uses CommonJS modules and integrates tightly with NPM. 

    Webpack is an attempt to unify the modules landscape by supporting AMD, CommonJS and ES6 modules. It handles JavaScript, CSS and other assets, as well as preprocessors for each. 

    RequireJS suffers in comparison to both of them, both in terms of features and workflow.

    1 。 AMD的代码必须写 在引用的  括号里面          

    2.   修改一个引用 需要改2个地方 , 这2个地方 还必须完全对应

    3.   amd 的优势是异步加载    但是commonjs 通过 webpack 和browserify 都能绕过同步加载这个问题

    4.  随着nodejs的发展,基于nodejs的工具生态系统 对前端开发的重要性体现出来了  例如 单元测试(Mocha, jasmine-node, Jest)

    5.  commonjs 可以使用 nodejs 中的一些模块  many small node modules        While it’s true that most libraries do support AMD

    //AMD

    define(['file1','file2'], function(Class1, Class2) {

        let obj = new Class1(),

        obj2 = new Class2();

        return obj.foo(obj2);

    });

    //commonJS

    let Class1 = require('file1'),

    Class2 = require('file2'),

    obj = new Class1(),

    obj2 = new Class2();

    module.exports = obj.foo(obj2);

    //ES6

    import Class1 from 'file1';

    import Class2 from 'file2';

    let obj = new Class1(),

    obj2 = new Class2();

    export default obj.foo(obj2);

    1. requirejs和seajs都是模块加载器,分别使用AMD和CMD规范,随着ES6标准的module出台渐渐会退出历史舞台,详细模块化的发展历史可以参考这篇文章如何学习前端模块化知识? - 前端开发

    2. browserify跟模块化相关,nodejs使用的是commons规范,为了前后端复用模块,通过这个作为转换工具,打包成一个bundle可以在前端加载使用

    3. webpack就是前端的构建工具了,其实webpack使用loader包含了一部分browserify的功能,只是不仅限于此,更专注于作为构建工具

    4. 集成babel, 用babelify可以配合browserify转化ES6或者使用webpack的loader

    https://link.zhihu.com/?target=http%3A//huangxuan.me/js-module-7day/%23/

    第一日 上古时期Module?从设计模式说起

    第二日 石器时代Script Loader只有封装性可不够,我们还需要加载

    第三日 蒸汽朋克Module Loader模块化架构的工业革命

    第四日 号角吹响CommonJS征服世界的第一步是跳出浏览器

    第五日 双塔奇兵AMD/CMD浏览器环境模块化方案

    第六日 精灵宝钻Browserify/Webpack大势所趋,去掉这层包裹!

    第七日 王者归来ES6 Module最后的战役

    相关文章

      网友评论

          本文标题:amd cmd commonjs es6

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