前端工程化是指遵循一定的标准和规范，使用工具和方法来对前端的开发流程进行规范化、标准化，以此来提高效率的一种手段
以前前端负责做的工作内容是简单的页面搭建和样式的展示，一般是demo页面，项目文件简单、数量不多，再被后端页面使用；对于数据如何在页面展示，由后端来获取数据并且完成这个数据渲染工作
但现在Web业务日益复杂化和多元化，前端需要负责的内容变得多了起来，一个项目工程变得复杂并产生了很多问题，前端工程化就是为了解决项目工程复杂后所产生的问题而存在
一些开发中遇到的问题：
js中使用es6的新语法，但浏览器不兼容
使用sass、less等语法增强css编写，但运行环境不能直接支持
使用模块化、使用框架的方式来提供维护性进行开发时，不能直接支持
开发时一些重复格式的文件要手动配置
部署上线前的手动压缩打包文件和手动上传到服务器等操作不能自动完成
多人协调开发时编码风格无法统一，仓库中代码质量无法管理，pull后可能导致代码出现问题
一些功能开发时，需要等待后端接口完成，非常依赖后端服务
工程化的目的
提高效率、降低维护成本、保证质量，所有能实现这个目的的方法手段都属于工程化
项目当中一切重复的工作都应该是自动化的
项目创建：创建项目结构、特定类型的文件（脚手架来自动搭建基础结构）
编码：格式化代码、编码风格校验、编译（语法兼容）
预览/测试：修改代码后实时预览效果（热更新 Web Server）、编译后代码定位问题 （Source Map）、模拟数据来开发 （Mock）
提交：代码仓库自动化管理，提交代码前，代码质量、风格检查
代码部署：用命令的方式来上传文件到服务器、自动更新文件服务器发布
工程化和工具
前端工程化不是特指某一个工具，工程化的核心是利用一系列工程化管理技术，对项目进行整体的规划和架构，只是有些工具功能集成很多，可以实现很多功能，例如webpage，但工具不等于工程化，工具只是通过它来实现工程化架构的一种手段
工程化需要对整个项目进行结构的设计，规划好范式，设定好用什么方式、什么语法来写代码，什么方式来实现前后端分离，代码怎么测试，怎么预览效果，代码仓库如何管理，线上如果部署等等，一系列的方案确定好后，再通过工具来实现这些方案
常用的一些框架cil，实际上除了是一个脚手架外，还是属于针对某一种特点技术的工程化集成；例如vue-cil，就规定了vue项目的一个文件架构，vue文件怎么放，src文件夹里面有什么，提供了热更新的工具，编译vue工具，以及代码风格校验的eslint等等
