1.3 主要研究内容和目的 13

1.4 论文结构 15

2 前端自动化介绍和技术分析 16

2.1 自动化构建工具的出现 16

2.2 NODE.JS介绍 18

2.3 NPM介绍 21

2.4 GRUNT简介 23

2.5 GULP简介 24

2.6 小结 26

3 技术研究和比较 27

3.1 调研 27

3.2 原理和实现 30

3.2.1 Grunt 30

3.2.2 Gulp实现以及和Grunt的部分区别 32

3.3 小结 35

4 开发实例——在线考试系统 36

4.1 考试系统简介 36

4.2 自动化构建方案选择 37

4.3 前端工程化方案 37

4.4 后端方案 38

4.5 主要功能模块介绍 39

4.5.1 身份验证模块 39

4.5.2 试题模块和试卷模块 40

4.6 自动化构建的实现 42

4.7 小结 44

5 总结 45

致谢 46

参考文献 47

1 绪论

2001年秋季，网络泡沫经济的爆发标志着网络的转折点。这时市场也出现了剧烈的动荡。实际上这些伴随着网络泡沫而来的动荡正是所有技术的共同特征。这些动荡通常标志着旧的技术渐渐刷退，而新的技术正在逐渐占领中央舞台。也正是这个时候，“web2.0”的概念出现，并逐渐兴起。网页在这时起到了至关重要的作用，令人兴奋的新应用和网站也如雨后春笋一般冒了出来。更重要的是，在这次动荡之中幸存下来的网络公司似乎有着一些共同的特点。顺应着这些规律web2.0逐渐兴起，它也成了自网络泡沫之后的重要转折点[1]。

1.1 研究背景

根据近期的研究显示，在所有的网络通信流量中，web通信的所占份额已经达到了60%以上[2]。如今的web已经成为了人们生活交流的信息管理与资源组织的平台。在现在的万维网Internet中，web通信已经无可争议的成为了最为重要的信息和资源交流媒介。

在web1.0时期，网页还是没有分离前端后端的概念，网站往往是粗糙的HTML页面和简单的鼠标点击交互。在网页开发的早期时代，还没有前端开发的概念，人们认为网页只是简单的页面切换的操作，甚至于HTML+CSS都不被承认是开发语言。人们对于网页前端并不重视。但是随着web1.0时代的结束，web2.0概念的提出，网页开发技术开始了空前的而又迅速的发展。首先是css2.0标准被制定，标准开始呼吁和要求在页面开发时将内容和样式分离开进行设计，这样不仅是为了能够方便开发进行后期的维护，还将开发中各环节的职责分离和区别开来。不仅让前端开发更加的规范，还令前端开发工作有了一套自己的标准。正是由于这些新标准的制定，使网页开发的架构和设计开始被人们所重视，界面和技术的新框架也开始出现在了人们的视野里。Web前端开发的黄金发展时期也开始到来。论文网