web前端不止是JS和CSS，还有诗和远方。谈WEB前端工程化

标题起的有点骚包哈，其实是说，WEB前端的主战场是“前端工程化”。

前端就前端呗，为啥还要加个“工程化”？

很简单，因为前端变复杂了。复杂到必须把一个个网页切成许多块、零件，这些零七八碎的东西如何有效率的正确的组合起来让它们干活，这就需要有一个“章程”，一个“办法”，现在通用的称呼就是“前端工程化”。

工程化的定义有许多，我们不纠结所谓最准确的定义哈，那没有意义。无论它是什么定义，它的工作内容基本上都是大体相同的，“各种前端开发模式、MVC、MVVM、SPA之类的；一些自动化的更新、发布、模块管理、目录创建；团队协同开发、代码版本管理、合并；自动压缩、替换、合并请求等”，诸如此类的一些用来提高工作效率的事情，这些都在工程化的范畴之内。

现在我个人主观认为，前端学习有二条主线：一，是前端的技术本身；二，是前端工程化的进化。

这二条学习主线即是部分重叠的，但又有主次之分。必须先学好JS、CSS，才能学好前端工程化。而前端工程化本身的演进，又是随着实际业务而发展变化的。反过来新的业务需求，又要求有新的前端工作化，进而又要求有新的前端技术。

这二者是一条永无止境、互为表里的莫比乌斯环。

什么情况下，我们会认为一个人的前端开发水平，是上了一个档次，上了一个台阶呢？

大局观。

啥叫WEB前端开发的大局观？

站在前端的角度，全面的、多层次的审视“项目的全流程”。包括但不限于，提出需求，需求文档、UI设计、交互原型、开发规范、模块化、组件化、代码仓库、性能压缩、部署上线、开发流程与工具选型。这就是我以为的前端开发大局观。

在这一系列的要素之中，JS、CSS等纯代码类的内容，只占一小部分。剩下的要么是技术积累，要么是理解业务、工程优化的。

如果过于侧重技术与开发相关的内容，则必然导致“前端工程化”变为”前端工具化“，会陷入为了工程化而工程化的泥潭。

具体表现之一，就是经常换工具，一会这个，一会那个。真正的代码没多少，但开发环境一时半会稳定不下来。

前端工程化，并不是一个很虚的概念。正相反，它是一个很接地气的东西。不同公司，不同团队，不同产品，跨产品线，跨部门合作，这些不同的工作场景都需要有不同的工作流程，而规范这些工作流程的，就是前端工程化。

在理解业务，适应需求的前提下，

一，规范多人、多岗位的对接格式；

二，把能自动化的操作，都给自动化了；

这就是工程化。

甚至你可以更加简单粗暴的把前端工程化理解为“规范+流程+自动”。OK，你这么认为没有问题。

网上很多的前端工程化的相关文章，说一千道一万，其实也只是在说，如何制订规范？如何理顺流程？如何配置一系列的自动工具。

许多同学在初入前端的时候，眼里只有HTML、CSS、JS，这样并没有错，也必须这样，聚焦嘛。

但在这个阶段，你只是一个写页面的，NO NO NO，也许连写页面都算不上，也许你只是一个切静态页面的，顺便写点页面级别的JS交互脚本。

什么WEB前端开发，，什么前端工程师，这些名称跟此时的你，一点关系都没有。

但身处这个阶段并没什么不好意思的，也不丢人，这是每个前端人成长的必经之路。但你要做到，手里切的是页面，眼里看的是模块，心里装的是整个网站。

网站已经是一个事实上的在线网络应用软件了，那你在切页面的时候，有必要想一想，你手里的这个正在切的页面，或是正在写的小模块，在整个应用中，是处于什么样的位置、层级？

也许你没有答案，但你要想，要多想。要做到“虽不能至，心向往之”~

想什么呢？也许做为前端小白的你，脑子里此时空空荡荡。哈哈哈，想想你负责的部分，怎么能更有效率？如何能在各种业务场景中，以适当的方式加载所需资源？试着画出你所参加的项目的整体的结构图？你手里的哪些工作可以改为自动化？

网站这种实时在线的网络应用，它是免安装的，打开就用。各种资源怎么加载？如何更新？缓存咋整？你的页面加载流程是什么样的？合理不？。。

当你开始思考以上那些问题的时候，你才能真正的踏上成为“WEB前端工程师”的道路。

也许时间要很久，也许永远达不到。但心里一定要明白，前端工程化才是前端开发的广阔天地，也只有工程化的前端开发，才能让你真正的大有作为。