我们来说全局配置，我们知道导入require.js之后会设置data-main属性来执行入口文件，然后再入口文件中进行require的配置。...配置非AMD规范JS： 我们知道要配置模块，js文件必须要使用AMD规范来编写，就是加上define函数，主动返回函数等操作。...但是我们以前编写的js，肯定没有这些功能，修改起来又比较麻烦，所以需要配置非AMD规范的JS。...render(name) { console.log(name); } function initial(name) { console.log(name); } 这里面的normal就是非AMD..., normal) { normal.render("render"); normal.initial("initial"); }) }) 配置全局属性和配置非AMD
( "jquery", [], function() { return jQuery; }); } Require.js中使用jQuery Require.js中使用jQuery...); }); Require.js中使用jQuery 插件 虽然jQuery的支持AMD的API， 这并不意味着jQuery插件也是和AMD兼容的。...function ($) { $.fn.myPlugin = function () { //你自己的插件代码 }; })(jQuery); 不过我们稍微修改一下就可以使用Require.js...} }(function ($) { $.fn.jqueryPlugin = function () { //插件代码 }; })); Require.js中使用jQuery...UI组件 Require.js中使用jQuery UI组件也类似的，只要改造一下jQuery Widget Factory 代码就可以了，并且感觉jQuery UI的依赖关系加载就可以了。
通过require.js 可以对javascript文件进行别样引用 Require.js的使用： 第一步： 只需在html页面中引用require.js 就够了 第二步： 在引用require.js...的时候，要设置async属性为ture 确保不会阻塞页面 第三步：单写一个js文件，用于引用相关的javascripnt文件，这个文件可以随便命名，一般叫main.js 第四步： 在引用require.js...时，通过data-main属性指定main.js ***模块化**** 原本我们在引用require.js，指定main.js后，可以直接在main.js中书写我们的javascript代码。...模块化：把我们需要的功能和属性定义成一个js文件，通过引用这个js文件就能使用其功能和属性 使用require.js 实现的模块化满足 AMD 标准 → Asynchronous Module Define
一、CommonJS和AMD 在介绍requireJS之前，要先说一下模块规范。目前，通行的Javascript模块规范共有两种：CommonJS和AMD。...这就是AMD规范诞生的背景。 3. AMD AMD是"Asynchronous Module Definition"的缩写，意思就是"异步模块定义"。...require(['math'], function (math) { math.add(2, 3); }); 目前，主要有两个Javascript库实现了AMD规范：require.js和curl.js...定义模块：避免全局名称空间污染 require.js加载的模块，采用AMD规范。也就是说，模块必须按照AMD的规定来写。...加载非规范的模块：shim 理论上，require.js加载的模块，必须是按照AMD规范、用define()函数定义的模块。
; 但这样的话，就没必要使用require.js了。真正常见的情况是，主模块依赖于其他模块，这时就要使用AMD规范定义的的require()函数。 ...因此，require.js提供了一个优化工具，当模块部署完毕以后，可以用这个工具将多个模块合并在一个文件中，减少HTTP请求数。 五、AMD模块的写法 require.js加载的模块，采用AMD规范。...六、加载非规范的模块 理论上，require.js加载的模块，必须是按照AMD规范、用define()函数定义的模块。...但是实际上，虽然已经有一部分流行的函数库（比如jQuery）符合AMD规范，更多的库并不符合。那么，require.js是否能够加载非规范的模块呢？ 回答是可以的。...举例来说，underscore和backbone这两个库，都没有采用AMD规范编写。如果要加载它们的话，必须先定义它们的特征。
前端模块化 (Require.js) ? 为什么要用 前端模块化 早期，js代码量小, 所有Javascript代码可以都写在一个文件里面，只要加载一个js文件就够了。...AMD : Async Module Definition 异步模块定义 require.js 依赖前置：在一开始就将所有的依赖项全部加载 CMD : Common Module Definition...通用模块定义 sea.js 依赖延迟：在需要的时候才去加载依赖项 模块化的实现（require.js） 下载后，把它放在目录下面，就可以加载了 定义模块 在require.js中，每个模块也是分成单独的文件保存的 每一个模块中都有自己单独的作用域！...标签的属性 这个属性可以用来指定一个文件，加载文件的路径会以这路径为基础， 指定的文件会在require.js加载完毕之后，通过异步的方式加载，并且执行里面的代码, <script src="<em>require.js</em>
; 但这样的话，就没必要使用require.js了。真正常见的情况是，主模块依赖于其他模块，这时就要使用AMD规范定义的的require()函数。 ...五、AMD模块的写法 require.js加载的模块，采用AMD规范。也就是说，模块必须按照AMD的规定来写。 具体来说，就是模块必须采用特定的define()函数来定义。...六、加载非规范的模块 理论上，require.js加载的模块，必须是按照AMD规范、用define()函数定义的模块。...但是实际上，虽然已经有一部分流行的函数库（比如jQuery）符合AMD规范，更多的库并不符合。那么，require.js是否能够加载非规范的模块呢？ 回答是可以的。...举例来说，underscore和backbone这两个库，都没有采用AMD规范编写。如果要加载它们的话，必须先定义它们的特征。
在javascript中，我们把比较复杂的都是用模块化，今天我们就来了解一下require.js来实现模块化开发 require.js是什么？...require.js是在AMD规范上实现的一个 JavaScript 模块异步加载器。...lib下存放一些常用的库，和我们最关键的require.js script下存放我们自己写的一些js。 index.html代码 <!...好了，下篇我们接着讲require的全局配置和非amd规范的模块导入。 延生(全局配置)：所谓全局配置，就是配置只需要设置一次，我们这篇的入口文件是main.js。...延生(非amd规范)： 非amd规范的模块就是不是使用define来定义的模块，和没有主动return返回你需要的函数这种类型的js。
所以很显然，AMD比较适合浏览器环境。目前，主要有两个Javascript库实现了AMD规范：require.js和curl.js。 RequireJS就是实现了AMD规范的呢。...; 但这样的话，就没必要使用require.js了。真正常见的情况是，主模块依赖于其他模块，这时就要使用AMD规范定义的的require()函数。 ...因此，require.js提供了一个优化工具，当模块部署完毕以后，可以用这个工具将多个模块合并在一个文件中，减少HTTP请求数。 五、AMD模块的写法 require.js加载的模块，采用AMD规范。...六、加载非规范的模块 理论上，require.js加载的模块，必须是按照AMD规范、用define()函数定义的模块。...但是实际上，虽然已经有一部分流行的函数库（比如jQuery）符合AMD规范，更多的库并不符合。那么，require.js是否能够加载非规范的模块呢？ 回答是可以的。
12、AMD与CMD的区别是什么？ 区别如下 （1）对于依赖的模块，AMD提前执行，CMD延迟执行，不过 require.JS从2.0版本开始，也改成可以延迟执行（根据写法不同，处理方式不同）。...16、require.JS与 SeaJS的异同是什么？ 相同之处如下。...require.JS遵循的是AMD规范， SeaJS遵循的是CMD规范。规范的不同，导致了两者API的不同。...（3） require.JS尝试让第三方类库修改自身来支持 require.JS。SeaJS不强推，采用自主封装的方式来“海纳百川”。 17、系统在设计上遵循几个原则？...服务器端规范主要是 CommonJS, Node.js用的就是 CommonJS规范客户端规范主要有推崇依赖前置的AMD和推崇依赖就近的CMD。AMD规范的实现主要有 require.js。
在a执行到require('b')的地方时会停下来去调用b,当去执行b，执行到一半发现require('a'),就停下来去调用a。
前面文章讲了FIS的源码实现细节，这篇文章偏实战一些，给出FIS跟require.js结合的简单例子。 FIS编译流程 如果已熟悉了FIS的编译设计，可以跳过这一节，直接进入下一小结。...喜欢require.js，但又喜欢用CMD编写模块的朋友有福了，下面会简单介绍如何整合require.js与FIS。 demo已经放在github，下载请猛戳。 首先看下项目结构。...到AMD的转换。...postprocessor插件的配置看settings.postprocessor，type为AMD，表示对模块进行AMD包裹。...，比如require.js的配置支持，打包部署等，这里也就抛个思路，感兴趣的童鞋可以进一步扩展。
后来随着require.js的推广和使用，就逐渐形成了AMD（The Asynchronous Module Definition），也就是"异步模块加载机制"。...这里通过一个计算幂运算的例子，详细论述require.js的使用。 2. 详论 AMD模块规范听起来很高大上，但实际上并不是很复杂。...标准规范来构建的，所以可以通过require.js来引入。...DOCTYPE html> RequireJS-AMD规范 <...这里还要注意的是AMD规范的脚本加载是异步的，同时会预先加载所有的依赖模块的脚本直到完成，再进入本脚本内容。 3. 结果 运行结果如下，输入底数和指数后，点击按钮就会生成正确的结果： ? 4.
本文作者：IMWeb 陈映平 原文出处：IMWeb社区 未经同意，禁止转载 前面文章讲了FIS的源码实现细节，这篇文章偏实战一些，给出FIS跟require.js结合的简单例子。...喜欢require.js，但又喜欢用CMD编写模块的朋友有福了，下面会简单介绍如何整合require.js与FIS。 demo已经放在github，下载请猛戳。 首先看下项目结构。...到AMD的转换。...postprocessor插件的配置看settings.postprocessor，type为AMD，表示对模块进行AMD包裹。...，比如require.js的配置支持，打包部署等，这里也就抛个思路，感兴趣的童鞋可以进一步扩展。
提示 由于CommonJS和AMD都十分流行，但似乎缺少一个统一的规范。于是，UMD(通用模块规范)出现了，它可以同时支持这两种风格。...这就是AMD规范诞生的背景。 AMD是"Asynchronous Module Definition"的缩写，意思就是"异步模块定义"。它采用异步方式加载模块，模块的加载不影响它后面语句的运行。...目前，主要有两个Javascript库实现了AMD规范：require.js和curl.js。本系列的第三部分，将通过介绍require.js，进一步讲解AMD的用法，以及如何将模块化编程投入实战。...require.js的加载 使用require.js的第一步，是先去官方网站下载最新版本，下载后，假定把它放在js子目录下面，就可以加载了。...对于不知道是否遵守了amd标准的模块，可引入后打印一下，看一下引入后传递的是什么。
模块规范：CommonJS和AMD node.js的模块系统，就是参照CommonJS规范实现的 在CommonJS中，有一个全局性方法require()，用于加载模块 CommonJS规范不适用于浏览器环境...浏览器端的模块，不能采用”同步加载"（synchronous），只能采用"异步加载"（asynchronous） AMD Asynchronous Module Definition 是异步加载模块定义...浏览器端的应用适合AMD模块规范 主要有两个Javascript库实现了AMD规范：require.js和curl.js ?...require.js的用法 实现js文件的异步加载，避免网页失去响应 管理模块之间的依赖性，便于代码的编写和维护 http://requirejs.org/docs/download.html 模块必须采用特定的define()函数来定义
再进一步，兼容AMD规范 要兼容AMD也简单，判断一下环境，是否满足AMD规范。如果满足，则使用require.js提供的define函数定义模块。...函数，并且define函数具备amd属性，则可以判断当前环境满足AMD规范 console.log('是AMD模块规范，如require.js') define(factory...) { console.log('是AMD模块规范，如require.js') define(factory()) } else if (typeof define...'是AMD模块规范，如require.js') define(['depModule'], factory) } else { console.log('没有模块环境...) { console.log('是AMD模块规范，如require.js') define(['depModule'], factory) } else if
执行该函数 }; 这是大概的CommonJS 流程 详见CommonJS规范 AMD（异步模块定义） AMD 是 RequireJS 在推广过程中对模块定义的规范化产出。...当执行到这一段代码的时候， 浏览器会先 加载 math 模块，在math模块加载成功后， 再执行后面的回调函数 math.add(2,3) require.js 说道AMD 就不得不提 require.js...首先下载最新require.js ，然后在 html 底部写上如下代码： data-main...CMD 跟 AMD 在使用方面非常相似。（其实我没用过） 知呼上的比较 对于依赖的模块，AMD 是提前执行，CMD 是延迟执行。...CMD 推崇依赖就近，AMD 推崇依赖前置。
阮一峰老师在Javascript模块化编程（三）：require.js的用法 一文中总结了这样写法的缺点： 12345 首先，加载的时候，浏览器会停止网页渲染，加载文件越多，网页失去响应的时间就会越长...使用一般的方法引入： 1 但是这样的方法，还是可能在加载require.js的时候导致网页失去响应。...假设我们的主模块为js/home.js,引入代码应该如下： 12 //require.js...AMD模块编写 require.js加载的模块的采用的AMD规范。所以我们的模块必须按照AMD的规定来写。...关于AMD规范详情可以看这个文章：Javascript模块化编程（二）：AMD规范 模块有两个情况，不依赖其他模块和依赖其他模块。 不依赖其他模块 直接define定义，使用function回调。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频
