为了应对日益复杂，大规模的JavaScript开发。我们化整为零，化繁为简。将复杂的逻辑划分一个个小单元，各个击破。这时一个项目可能会有几十个甚至上百个JS文件，每个文件为一个模块单元。如果上线时都是这些小文件，那将对性能造成一定影响。
RequireJS提供了一个打包压缩工具r.js来对模块进行合并压缩。r.js非常强大，不但可以压缩js，css，甚至可以对整个项目进行打包。
r.js的压缩工具使用UglifyJS或Closure Compiler。默认使用UglifyJS（jQuery也是使用它压缩）。此外r.js需要node.js环境，当然它也可以运行在Java环境中如Rhino。
下面以一个简单的示例来感受下r.js，创建的目录如下：
和RequireJS入门（三）目录结构一样，写了三个模块cache，event，selector。main.js也未做修改，实现的功能仍然是为页面上的所有段落P元素添加个点击事件，点击后弹出P的innerHTML。唯一的区别是目录中多了个r.js。
index.html做了修改，如下：
<!doctype html>
<html>
<head>
<title>requirejs进阶（一）</title>
<meta charset="utf-8"/>
<style type="text/css">
p {
background: #999;
width: 200px;
}
</style>
</head>
<body>
<p>p1</p><p>p2</p><p>p3</p><p>p4</p><p>p5</p>
<script data-main="built" src="require.js"></script>
</body>
</html>
注意，data-main改为了“built”，上一篇的是“main”。我们将使用r.js把js目录下的cache.js，event.js，selector.js，main.js合并压缩后写到r4目录中。
好，让我们开始合并压缩吧。打开windows命令窗口，cd到r4目录中，输入命令node r.js -o baseUrl=js name=main out=built.js
命令行信息可以看到已经将各个js文件合并成功了。这时回到r4目录会发现多了一个built.js文件。
好了，合并压缩过程完成了。
运行结果：
网络请求如下：
可以看到除了require.js，就只有built.js了。大大减少了JS文件的http请求。这时点击页面上各个P元素，会弹出对应的innerHTML
这说明功能完损无缺。
下面对命令行做个简单解释。
node r.js -o baseUrl=js name=main out=built.js
-o 表示优化，该参数是固定的，必选。
baseUrl 指存放模块的根目录，这里是r4/js，因为cd到r4中了，只需设置为js。可选，如果没有设置将从r4中查找main.js。
name 模块的入口文件，这里设置成“main”，那么r.js会从baseUrl+main去查找。这里实际是r4/js/main.js。r.js会分析main.js，找出其所依赖的所有其它模块，然后合并压缩。
out 指合并压缩后输出的文件路径，这里直接是built.js，那么将输出到根目录r4下。
好了，再介绍两个参数
1.excludeShallow 合并时将排除该文件
node r.js -o baseUrl=js name=main out=built.js excludeShallow=selector
可以看到输出信息中不再包括selector.js。这时运行index.html页面，会发现selector.js被单独请求下来了。
2.optimize (none/uglify/closure) 指定是否压缩，默认为uglify
不传该参数时r.js默认以UglifyJS压缩。设置为none则不会压缩，仅合并，这在开发阶段是很用用的。
node r.js -o baseUrl=js name=main out=built.js optimize=none
这时生成的built.js是没有压缩的，如下所示：
总结：
这里演示了采用模块开发后上线前的一个小示例：把所有模块文件合并为一个文件。
先下载r.js放到开发目录中，然后使用命令行来合并压缩。其中演示了命令行参数-o、baseUrl、name、out及excludeShallow、optimize的使用。-o、name、out是必选的，其它为可选。
相关推荐
在本篇关于"RequireJS进阶（二）"的文章中，我们将深入探讨RequireJS这一JavaScript模块化加载器的高级用法和概念。RequireJS是AMD（Asynchronous Module Definition）规范的一个实现，它允许我们在浏览器环境中进行...
RequireJS是JavaScript中的一种...综上，RequireJS进阶不仅涵盖了其基本的模块加载和依赖管理，还包括了高级的配置、优化技巧以及与其他库的兼容性。理解并掌握这些知识点，有助于提升JavaScript项目的可维护性和性能。
总的来说，"requirejs-task-list"的学习计划涵盖了RequireJS的基础和进阶知识，通过这个任务列表，开发者可以系统地掌握这一模块化工具，提升JavaScript开发能力。在实践中不断探索和理解，才能更好地利用RequireJS...
综上所述，"狂神说——大前端进阶NodeJS、Npm、Es6、Babel、Webpack、模块化使用笔记"这个主题涵盖了现代前端开发的重要技术栈。Node.js作为后端基础，Npm辅助管理依赖，ES6提供了更优雅的语法，Babel确保了新特性的...
在JavaScript的世界里，"基础进阶"是一个关键的阶段，意味着开发者已经掌握了基本语法，准备深入探索语言的高级特性和实战技巧。在这个阶段，我们通常会接触到源码分析，这有助于提升对JavaScript运行机制的理解。...
RequireJS是一个JavaScript模块加载器，它允许在项目中按需加载和管理依赖，优化脚本的加载效率。 ### 16. **错误处理** 在Backbone.js应用中，良好的错误处理机制能确保程序的健壮性，包括捕获和报告错误。 ### ...
在实际开发中，还可以使用AMD（异步模块定义）或CommonJS（服务器端模块系统）等模块系统，如RequireJS和Node.js的`require`。这些系统提供了更高级的模块管理和加载机制，支持模块间的依赖关系和异步加载，适用于...
- 模块化是组织代码的重要方式，JavaScript有CommonJS（Node.js）、AMD（RequireJS）和ES6的import/export机制。 5. **异步编程**： - JavaScript是单线程的，通过事件循环和回调函数处理异步任务。 - Promise...
JavaScript，作为全球最广泛使用的脚本语言之一，...通过学习和掌握以上JavaScript在网络编程中的基础知识，开发者可以构建出功能丰富的交互式网页应用，并为进阶的前端框架和库如React、Vue、Angular打下坚实的基础。
学习AMD和CMD规范，以及相关的工具如RequireJS和SeaJS，可以帮助你实现模块化开发。基于组件的思想，可以提高代码复用和维护性。 **第七阶段：主流的流行框架** Web开发工作流的工具如Git版本控制、Yeoman脚手架、...
JavaScript教程源代码是针对初学者的一份宝贵学习资源，它涵盖了JavaScript编程语言的基础到进阶内容，特别是对于那些想要深入理解和应用函数的开发者来说。在本教程中，你将找到丰富的示例和实用的代码片段，这些都...
本手册详细涵盖了JavaScript的基础知识、进阶概念以及实际应用，对于程序员来说是必备的学习资料。 一、基础语法 JavaScript的基础包括变量、数据类型、操作符、流程控制和函数。变量用于存储数据，有六种基本数据...
在进阶部分，JavaScript的面向对象特性是关键。类和对象、封装、继承和多态是面向对象编程的核心概念。JavaScript通过原型链实现继承，这是其独特的特点。此外，ES6引入了类语法，使得JavaScript的面向对象编程更加...
大前端学习流程是一条完整的学习路线，可以帮助开发者从基础知识到高级特征，从HTML5到移动Web开发，再到HTTP服务和AJAX编程，最后到面向对象进阶和封装框架。该学习流程共分为九个阶段，每个阶段都涵盖了特定的知识...
8. **第19章** - 可能讨论了模块化编程，如CommonJS、AMD（RequireJS）、ES6模块系统，以及如何利用工具如webpack或rollup进行模块打包。 9. **第20章** - 可能涵盖了JavaScript中的定时器（setTimeout、...