js模块加载器－－requireJs

进入21世纪，人类科技迅速发展，互联网技术更是日新月异，今非昔比。作为互联网的重要组成部分的web技术也在发生着翻天覆地的变化，有了改头换面的进步。

随着网站功能不断丰富，web前端工程师们不得不面对的一个问题就是js的编程量越来越大，js文件会变的越来越臃肿。原有的通过script标签来导入一个个的js文件这种方式已经不能满足现代互联网开发模式，我们需要团队协作、模块复用、单元测试等等一系列复杂的需求。

什么是js模块化开发？

我理解的模块化开发就是将一个大功能细化，每个细化的模块之间相互独立。开发的时候可以独立不受干扰的开发，最终组合起来就是一个完整的功能。这样做有很多好处，对于团队合作是一个非常有利的模式。比如一个团队有多个人，可以每人负责一个模块的开发，最后合并到一起，整个网站的功能就ok了，这样是不是很帅呢！

今天我主题不是讲解如何进行模块化开发，因为模块化开发只是一个理念，无法量化的进行讲解，主要想给大家介绍一个模块化开发的辅助利器，模块加载器，此处暂时不详细讲解，因为一篇文章实在是无法将其精髓尽数展现，仅仅是抛砖引玉，介绍给大家，希望大家可以了解它，去学习它。当然日后我会以视频的方式给大家进行全面的讲解。自学是一个优秀程序猿必备的优良品质，我不希望大家从我的文章中只能学到我所分享的技术，我更希望大家可以学到我在文章中提到的每一项技术，我每天的文章都会有意无意的提到更多的东西，就是希望能让大家的眼界得到拓展，去挖掘前端领域更丰富的资源。

今天要推荐给大家的模块加载器是：RequireJS，RequireJS是一个非常小巧的JavaScript模块载入框架，是AMD规范最好的实现者之一。最新版本的RequireJS压缩后只有14K，堪称非常轻量。它还同时可以和其他的框架协同工作，使用RequireJS必将使您的前端代码质量得以提升。

我今天暂时不提它的具体用法，只说它的好处，我希望大家可以先自己去学习一下，然后再结合我后期的视频讲解，会达到更好的效果。

实用RequireJS有如下好处：

1.防止js加载阻塞页面渲染

2.使用程序调用的方式加载js，可以防止在页面中写入一大堆js调用。如下：

<script type="text/javascript" class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="a.js"></script>

<script type="text/javascript" class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="b.js"></script>

……

尼玛，是不是发现在页面写这么一对调用非常蛋疼，RequireJS可以不用这么干，所有的文件可以通过require的方式进行调用，每个页面可以只写一个js文件引用。

3.使用它可以很方便的进行模块化开发，完事儿之后require进去就ok。

这里我先说这么多，我既然提出了这个方法，已经听过它但是没有实践过的人我希望可以动手尝试一下，如果连听都没听过，那恭喜你，你看到这篇文章你就离大牛近了一步。

作者：王学兵
链接：https://www.jianshu.com/p/f0e0654e47a3