前端工程化主要解决的问题

• 无法使用模块化/组件化
• 重复的机械式工作
• 代码风格统一、质量保证
• 依赖后端服务接口支持
• 整体依赖后端项目
• 传统语言或语法的弊端

工程化表现

一切重复的工作都应该被自动化

• 创建项目：创建项目结构；创建特定类型文件
• 编码：格式化代码；校验代码风格；编译/构建/打包
• 预览/测试：Web Server/Mock、Live Reloading/HMR、Source Map
• 提交：Git hooks；Lint-staged、持续集成
• 部署：CI/CD、自动发布

工程化不等于某个工具

工程化是指对项目整体的规划，而工具是实现的手段，就比如webpack。

工程化与Nodejs

工程化的实现归功于Nodejs。前端工程化是一个很庞大的概念。

• 脚手架工具开发
• 自动化构建系统
• 模块化打包
• 项目代码规范化
• 自动化部署

目前，有很多公司的架构是BFF，即 Backends For Frontends（服务于前端的后端），这是一种基于nodejs的一种架构，nodejs在其中充当一个中间层，BFF实际上是针对不同的业务平台分别开发一层独有的、很薄的服务。

增加一个中间层，其实是为了解耦，但BFF只是逻辑分层的名称，不是具体的技术。实现BFF的技术框架有多种。从BFF层的组织架构归属看，由前端团队或后端团队负责则会引入各自不同的技术选型。前端有NodeJS、GraphQL框架等，后端有Java、GraphQL框架、网关框架等。因此很多大厂的产品都有BFF层，但具体的实现各有不同。不妨来看一下BFF技术要考虑的4个方面的关键诉求。

针对于前端的发展历程，可以看前端的3.0时代 前端的发展过程 几张图了解前端是做什么的