Description
前言
随着移动互联网技术的发展，前端在整个项目体系建设中扮演的角色，所处的位置也越来越重要。越来越多的项目和系统，对前端开发人员的技能要求也越来越高，同时团队中前端工程师的人数的日益壮大，每个人代码风格也不一样，在协同开发和后续维护过程中，可能会带来一些问题。假如由你是该团队负责人，或这说由你来负责前端代码管理，你会怎么做？
自建Gitlab
代码就是公司资产。如何管理这笔资产就显得尤为重要了。自建gitlab是一个很基础，很有必要的。强烈建议使用Gitlab进行版本管理，自建Gitlab难度并不大，方便管理，包括代码管理、权限管理、提交日志查询，以及联动一些第三方插件。
可能有的公司还在用svn，或者IBM 提供的一些版本管理工具（RTC）。但还是不如gitlab用起来流畅。因此强烈建议Gitlab来代码管理。
GitLab是由GitLab公司开发的、基于Git的集成软件开发平台。另外，GitLab且具有wiki以及在线编辑、issue跟踪功能、CI/CD等功能。
制定代码开发规范 Code Guide
为什么要有团队代码规范？
虽然这些细节是小事，不会有体验或者性能上的优化，但是却体现了一个coder和团队的专业程度 团队的愿景：成为业界卓越的Web团队！所以不管团队有多少人，代码风格都应该师出同门！
以web前端为例，我们看看代码规范大概会包含哪些方面：
命名规则
项目命名
目录/文件夹命名
JavaScript文件命名
css（scss，less）文件命名
html文件命名
HTML文件代码规范
语法（缩进，dom属性命名规范，单引号双引号的运用）
lang属性
字符串编码
IE兼容模式
css引入方式
JavaScript文件引入顺序
避免dom标签嵌套的层级过多
css 文件代码规范
缩进
分号
空格
换行
注释方案
命名
媒体查询
等等。。。
JavaScript 文件代码规范
缩进、空格、换行、注释。。。
变量命名
函数引用
数组对象
......其他
根据相关方案，制定好如上开发规范即可。这里强烈推荐腾讯的AlloyTeam团队的以及airbnb团队的javascript开发规范
代码检查校验 ESlint
在上一步中，我们谈到了参照规范来编写代码，可能有时候多多少少还是会忽略或忘记某些规范，比如空格，缩进，变量引用命名等。因此，这里要引入ESlint，客观层面依照配置文件来检查我们的代码是否按照规范开发。
ESlint优点总结如下：
降低低级bug（例如拼写问题）出现的概率；
增加代码的可维护性，可阅读性；
硬性统一代码风格，团队协作起来时更轻松；
ESlint推荐直接配置到脚手架之中，对我们提高代码的可维护性的帮助会很大。
代码美化 Prettier
Prettier，顾名思义，pretty的比较级，可以强硬的翻译为‘更漂亮的’。那到底什么是Prettier呢？从Prettier官网首页能看到它是什么：
An opinionated code formatter（一个有态度的代码格式化工具）
Supports many languages（支持多种语言）
Integrates with most editors（集成到绝大多数编辑器）
Has few options（仅需极少的配置选择（其他代码格式化的工具配置选项太多了））
// with yarn
yarn add prettier --dev --exact
# or globally
yarn global add prettier
// with npm
npm install --save-dev --save-exact prettier
# or globally
npm install --global prettierTypeScript 增加了代码的可读性和可维护性
类型系统实际上是最好的文档，大部分的函数看看类型的定义就可以知道如何使用了
在编译阶段就发现大部分错误，这总比在运行时候出错好
增强了编辑器和 IDE 的功能，包括代码补全、接口提示、跳转到定义、重构等
结语
本文主要总结了管理好前端代码需要注意的几个点：
搭建代码仓库
制定基本代码编写规范
ESlint
prettier + husky
typecript + tslint
UI单元测试
代码评审 code review