样式模块化的好处RequireJS被设计用来加载JavaScript模块的，可是大家有没有联想到其实样式文件可以进行模块化处理，那么问题来了，RequireJS能不能像加载脚本文件一样来加载样式文件呢？ 虽然RequireJS本身没有实现这个功能，但官网推荐了一些常用的插件供我们使用，官网插件插件地址为：http://requirejs.org/docs/plugins.html，同时在github上也有社区大量贡献的插件：https://github.com/jrburke/requirejs/wiki/Plugins 当然...
模块加载器的概念可能稍微接触过前端开发的童鞋都不会陌生，通过模块加载器可以有效的解决这些问题： JS文件的依赖关系。通过异步加载优化script标签引起的阻塞问题可以简单的以文件为单位将功能模块化并实现复用主流的JS模块加载器有requireJS，SeaJS等，加载器之间可能会因为遵循的规范不同有微妙的差别，从纯用户的角度出发，之所以选requireJS而不是SeaJS主要是因为： 功能实现上两者相差无几，没有明显的性能差异或重大问题。...
最近有一个项目使用了 requirejs 来解决前端的模块化，但是随着页面和模块的越来越多，我发现我快要hold不住这些可爱的js文件了，具体表现在每个页面都要设置一堆 requirejs 的配置( baseUrl ， paths 之类的)。 不知谁说过，一些事重复做了三次，就该考虑一下自动化了，于是我小心翼翼的掏出了我的 grunt 。 我们得使用 grunt-contrib-requirejs 这个插件来实现如上所说的自动化功能，这个就是根据 r.js 封装的 grunt 插件。 安装...
一、为什么使用RequireJS？<script src="a.js"></script><script src="b.js"></script><script src="c.js"></script> 上述多个js文件加载的时候，浏览器会停止网页渲染(JS阻塞浏览器渲染)，加载文件越多，网页失去响应的时间就会越长；另外各文件的依赖关系很难管理。 RequireJs的作用： （1）实现js文件的异步加载，避免网页失去响应； （2）管理模块之间的依赖性，便于代码的编写和维护。 （3）定义了一个作用域来避免全局名称空...
现在看看RequireJS带来的整洁的特点： 下面有个html页面： <html> <head> <title>configuration</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <link type="text/css" href="../master/plugin/artDialog4.1.6/skins/blue.css" rel="stylesheet"/> <script data-main="../master/script/app/config" src="../master/script/third_party/require.js"></script> </head> 最有一个script语句引入了req...
本文是requireJS的一些知识点的总结，配上多页面应用中的实例分析。 本案例的目录结构如下： requireJS API的三个主要函数：define（创建模块），require（加载模块），config（配置） 1、 HTML文件中加载JS文件 page1.html内容如下： <!DOCTYPE html> <html> <head> <title>Page 1</title> <script data-main="scripts/page1" src="scripts/lib/require.js"></script> </head> <body> <a href="page2.html">Go to Page 2</a> </bo...
RequireJS介绍 RequireJS由James Burke创建，他也是AMD规范的创始人。RequireJS会让你以不同于往常的方式去写JavaScript。你将不再使用script标签在HTML中引入JS文件，以及不用通过script标签顺序去管理依赖关系。 RequireJS是一个非常小巧的JavaScript模块载入框架，是AMD规范最好的实现者之一。最新版本的RequireJS压缩后只有14K，堪称非常轻量。它还同时可以和其他的框架协同工作，使用RequireJS必将使您的前端代码质量得以提升...
项目中大都使用模块化开发，requireJS作为AMD模块开发的典范，所以有必要学习下。通过一步步利用requireJS编写demo，从而学习requireJS的一个整体开发流程以及自我使用requireJS的一些感受。 AMD：一种基于模块的异步加载JavaScript代码的机制，它推荐开发人员将JavaScript代码封装进一个个模块，对全局对象的依赖变成了对其他模块的依赖，无须再声明一大堆的全局变量。通过延迟和按需加载来解决各个模块的依赖关系。模块化的JavaS...
由于js的代码逻辑越来越重，一个js文件可能会有上千行，十分不利于开发与维护。最近正在把逻辑很重的js拆分成模块，在一顿纠结是使用requirejs还是seajs的时候，最终还是偏向于requirejs。毕竟官方文档比较专业嘛... 不过即便是有完整的官方文档，仍然遇到不少的问题，比如jquery-ui的使用。 下面就循序渐进的讲解一下我遇到的问题，以及解决的办法。关于AMD和CMD的理解AMD（异步模块定义）的典型就是requirejs，而CMD（通用模块定...
由于js的代码逻辑越来越重，一个js文件可能会有上千行，十分不利于开发与维护。最近正在把逻辑很重的js拆分成模块，在一顿纠结是使用requirejs还是seajs的时候，最终还是偏向于requirejs。毕竟官方文档比较专业嘛... 不过即便是有完整的官方文档，仍然遇到不少的问题，比如jquery-ui的使用。 下面就循序渐进的讲解一下我遇到的问题，以及解决的办法。 关于AMD和CMD的理解 AMD（异步模块定义）的典型就是requirejs，而CMD（通用模块...
在前端模块化的时候，不仅仅是js需要进行模块化管理，html有时候也需要模块化管理。这里就介绍下如何通过requirejs，实现html代码的模块化开发。如何使用requirejs加载htmlReuqirejs有一个text的插件，它可以读取指定文件的内容，读取到的内容就是文本。如何下载text插件第一种方法，可以通过npm下载： npm install requirejs/text 第二种方法，也可以直接去官方github上面直接下载。 直接拷贝内容到text.js中即可。如何安装text插...
RequireJS 是一个前端模块化开发的流行工具，本身是一个Javascript的库文件，即require.js 。 RequireJs的主要功能： （1）实现js文件的异步加载，避免网页失去响应； （2）管理模块之间的依赖性，便于代码的编写和维护。 前端模块化开发现在有好多的工具，大体上分为两类，一类是像dojo之类的高大全，dojo v1.8之后已经内置了模块化开发组件；另一类是像require.js，sea.js 这种专心做模块化开发的工具。 从模块化划分的规则来区分...
本文采取循序渐进的方式，从理论到实践，从RequireJS官方API文档中，总结出在使用RequireJS过程中最常用的一些用法，并对文档中不够清晰具体的内容，加以例证和分析，分享给大家供大家参考，具体内容如下 1. 模块化 相信每个前端开发人员在刚开始接触js编程时，都写过类似下面这样风格的代码： <script type="text/javascript">var a = 1;var b = 2;var c = a * a + b * b;if(c> 1) {alert(c > 1);}function add(a, b) {return a +...
为什么学习RequireJS？ 像我这种菜鸟，会提到海量文章里提到的AMD、JS模块化编程、异步... ... 等等 RequireJS会让你以不同于往常的方式去写JavaScript。你将不再使用script标签在HTML中引入JS文件，以及不用通过script标签顺序去管理依赖关系。 RequireJS是一个Javascript 文件和模块框架，它可以帮我们去管理js代码（我的理解）。 深入学习，我们便会被迫接受一系列的名词：data-main、require、define、baseUrl、paths、shims、...
简介 如今最常用的JavaScript库之一是RequireJS。最近我参与的每个项目，都用到了RequireJS，或者是我向它们推荐了增加RequireJS。在这篇文章中，我将描述RequireJS是什么，以及它的一些基础场景。 异步模块定义(AMD) 谈起RequireJS，你无法绕过提及JavaScript模块是什么，以及AMD是什么。 JavaScript模块只是遵循SRP(Single Responsibility Principle单一职责原则)的代码段，它暴露了一个公开的API。在现今JavaScript开发中，你可...