很多人可能这样认为,前端工程化无非就是框架/库、简单的构建、css/js模块化开发而已,其实这些只是前端工程话的一部分,当我们开发一个大型的web应用的时候,将会面临很多工程方面的问题,比如:多人如何协作开发、组件模块如何复用、如何调试部署、版本如何管理控制、性能如何优化。因此,做好前端工程化,需要我们做如下的几件事:
1.开发规范
制定好开发、部署的目录规范、编码规范、好的目录规范能让项目解构清晰,便于维护和扩展;好的编码规范能让团队人员的代码风格统一,便于代码的审查
2.模块化
针对JavaScript、CSS,以功能或者是业务为单元组织代码。JavaScript模块化方案有很多,如:AMD/CommonJS/UMD/ES 6 module等,CSS模块化基本都是在less、sass、stylus等预处理器的import/mixin特性的支持下完成的
3.组件化
将页面拆分成多个组件(component)。每个组件依赖的CSS、JavaScript、模板、图片等资源放在一起开发和维护。组件是资源独立的,组件在系统内部可复用,组件和组件之间可以嵌套。现在比较流行的前端框架比如: