博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
什么是前端工程化
阅读量:4094 次
发布时间:2019-05-25

本文共 897 字,大约阅读时间需要 2 分钟。

什么是前端工程化

前端工程化是使用软件工程的技术和方法来进行前端的开发流程、技术、工具、经验等规范化、标准化,其主要目的为了提高效率和降低成本,即提高开发过程中的开发效率,减少不必要的重复工作时间,而前端工程本质上是软件工程的一种,因此我们应该从软件工程的角度来研究前端工程。

前端工程化就是为了让前端开发能够“自成体系”,我倾向于认为主要应该从模块化、组件化、规范化、自动化四个方面思考。

模块化

模块化就是将一个大文件拆分成相互依赖的小文件,再进行统一的拼装和加载。

AMD : require.js

CMD : sea.js( 弃用了 )
COMMON.js : node.js

组件化

从UI拆分下来的每个包含模板(HTML)+样式(CSS)+逻辑(JS)功能完备的结构单元,我们称之为组件。

组件化≠模块化。模块化只是在文件层面上,对代码或资源的拆分;而组件化是在设计层面上,对UI(用户界面)的拆分。

组件化实际上是一种按照模板(HTML)+样式(CSS)+逻辑(JS)三位一体的形式对面向对象的进一步抽象。

所以我们除了封装组件本身,还要合理处理组件之间的关系,比如 (逻辑)继承、(样式)扩展、(模板)嵌套和包含等,这些关系都可以归为依赖。

规范化

规范化其实是工程化中很重要的一个部分,项目初期规范制定的好坏会直接影响到后期的开发质量。

(1)目录结构的制定

目录结构的合理设定,能为项目带来很多优点:

  • 有助于提高项目的逻辑结构合理性;
  • 对应扩展和合作;
  • 方便资源的统一定位管理。

(2)编码规范

制定一套良好的编码规范可以增强团队开发协作、提高代码质量。
推荐参考凹凸实验室打造的。

(3)文档规范

(4)组件管理

(5)git分支管理

(6)commit描述规范

(7)视觉图标规范

自动化

前端工程化的很多脏活累活都应该交给自动化工具来完成。需要秉持的一个理念是:

任何简单机械的重复劳动都应该让机器去完成。

  • 图标合并

  • 持续集成

  • 自动化构建

    -gulp,grunt

  • 自动化部署

  • 自动化测试

    集成单元测试,提高代码可靠性。前端较为流行的单元测试 mocha,qunit 等

转载地址:http://kovii.baihongyu.com/

你可能感兴趣的文章
XHProf-php轻量级的性能分析工具
查看>>
PHP7新特性 What will be in PHP 7/PHPNG
查看>>
比较strtr, str_replace和preg_replace三个函数的效率
查看>>
ubuntu 下编译PHP5.5.7问题:configure: error: freetype.h not found.
查看>>
PHP编译configure时常见错误 debian centos
查看>>
configure: error: Please reinstall the BZip2 distribution
查看>>
OpenCV gpu模块样例注释:video_reader.cpp
查看>>
【增强学习在无人驾驶中的应用】
查看>>
《python+opencv实践》四、图像特征提取与描述——29理解图像特征
查看>>
《python+opencv实践》四、图像特征提取与描述——30Harris 角点检测
查看>>
《python+opencv实践》四、图像特征提取与描述——31 Shi-Tomasi 角点检测& 适合于跟踪的图像特征
查看>>
OpenCV meanshift目标跟踪总结
查看>>
人工神经网络——神经元模型介绍
查看>>
人工神经网络——感知器介绍
查看>>
人工神经网络——反向传播算法(BackPropagation)
查看>>
进程的地址空间概述
查看>>
Windows 窗口底层原理
查看>>
一种函数指针的运用
查看>>
Win32程序之进程的原理
查看>>
C++虚函数原理
查看>>