美文网首页
JS模块化工具

JS模块化工具

作者: 大前端之路 | 来源:发表于2016-12-29 15:30 被阅读0次

AMD规范是依赖前置, CMD规范是依赖后置

AMD规范的加载器会把所有的JS中的依赖前置执行CMD是懒加载, 如果JS需要这个模块就加载, 否则就不加载, 导致的问题是符合AMD规范的加载器(requireJS), 可能第一次加载的时间会比较久, 因为他把所有依赖的JS全部一次性下载下来;

一:requirejs
AMD
JS模块化工具
亮点:
1、防止js加载阻塞页面渲染
2、防出现各种js引用丑陋的场景

define,require

require.config({
    paths : {
        "jquery" : ["http://libs.baidu.com/jquery/2.0.3/jquery", "js/jquery"],
        "a" : "js/a"
    }
})
require(["jquery","a"],function($){
    $(function(){
        alert("load finished");
    })
})
define(function(){ 
    function fun1(){
       alert("it works"); 
    } 
     fun1();
})

<a href="http://www.ruanyifeng.com/blog/2012/10/javascript_module.html">阮一峰Javascript模块化编程(一、二、三):模块的写法</a>
<a href="http://www.cnblogs.com/diligenceday/p/4504160.html">Require的MVC方式</a>

二:sea.js
CMD
<a href="http://seajs.org/docs/#docs">sea.js</a>

目的是解决nodejs的commonjs与前端统一
当然还有NPM兼容CommonJS, AMD, CMD 和 原生 JS写法

;(function(){ 
function MyModule() {
         // ... 
} 
var moduleName = MyModule; 
if (typeof module !== 'undefined' && typeof exports === 'object') { 
        module.exports = moduleName;
 } else if (typeof define === 'function' && (define.amd || define.cmd)) { 
        define(function() { return moduleName; }); 
} else { this.moduleName = moduleName; }
}).call(function() { 
        return this || (typeof window !== 'undefined' ? window : global);
});

相关文章

  • webpack学习笔记(踩坑笔记)

    认识webpack webpcak是基于JS应用的前端模块化打包工具,强调模块化(核心)和打包。流行打包工具:we...

  • 模块化

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

  • RequireJs的一些概念和用法

    概念 JavaScript语言本身是没有模块化的概念的,但是我们可以借助requirejs这个模块化工具,实现js...

  • JS模块化工具

    AMD规范是依赖前置, CMD规范是依赖后置 AMD规范的加载器会把所有的JS中的依赖前置执行。 CMD是懒加载,...

  • 关于webpack自己的一些看法

    webpack是一个js模块化构建工具,通过使用loader、插件,webpack称为了一个前端构建工具。工具的作...

  • 复杂的前端

    js工具 模块化打包类webpack,找出依赖,打包成体。各类工具的基本运行思路便是根据已有配置,从某个文件开始,...

  • 模块化开发

    js模块化开发vue模块化开发

  • 总结100+前端优质库

    转载自 趣谈前端js相关库js 常用工具类 「lodash」 一个一致性、模块化、高性能的 JavaScript ...

  • JS模块化工具requirejs

    RequireJS是一个非常小巧的JavaScript模块载入框架,是AMD规范最好的实现者之一。最新版本的Req...

  • require.js-js模块化工具

    1.require.js出现的原因 1)实现js文件的异步加载,避免网页失去响应; 2)管理模块之间的依赖性,便...

网友评论

      本文标题:JS模块化工具

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