前端工程化 前端工程化是使用软件工程 软件工程的技术和方法来进行前端项目的开发、维护和管理.
早期的非工程化前端开发方式, 与小作坊相似:
- 按照个人习惯制作 html 页面
- 使用 jQuery 等技术添加一些动态效果与数据
- 随便找个框架改一改 总之: 没有一个固定的规矩可以遵循, 没有标准化的操作流程. 很难保证质量.
前端工程化就是形成一套规矩, 把前端网站的制作标准化, 大概分为以下措施:
1.模块化
把耦合在一起的大文件 拆分成功能独立的小文件. 再进行统一的拼装和加载. 这样才能多人协作.
- 例如 JS 的模块化操作: commonJS , AMD , CMD
- webpack 工具: 进行模块的打包 2.组件化
代码的设计层面, 把不同的功能解耦合, 设计成可插拔的组件. 相当于: 台式机与笔记本的差别. 台式机的各个零件都可以随意替换 而不会影响其他组件
3.规范化
- 设定一个规范, 让所有参与人员的代码统一风格, 便于团队协作与维护.
- 目录结构的制定
- 代码规范
- 前后端接口规范
- 文档规范
- 组件管理
- git分支管理
- commit 描述规范
- 定期 Code Review
- 视觉图标规范
- .... 4.自动化
任何简单机械的重复劳动 都应该让机器自动完成
- 图标合并:webpack -- 雪碧图
- 自动化构建: 脚手架
- 自动化部署: 脚手架
- 自动化测试: 脚手架
- ......
