跳到主要内容

代码规范约束

在编写代码,我们往往需要IDE来提示我们某些信息,最重要的就是报错信息,通过IDE来告知我们这些信息,能够编写过程中就能察觉到问题所在,从而提高代码质量以及开发的效率。

常见场景就是我们需要遵从一个开发规范,通过IDE来抛出错误信息从而约束我们写的代码符合这个开发规范。

而通过一系列工具约束自身符合既定的开发规范,这一点在团队协作中尤为重要。

ESLint

ESLint 是一种静态代码分析工具,用于在编写 JavaScriptTypeScript 代码时识别和报告问题。它的主要目标是帮助开发者在早期阶段发现代码中的潜在错误和不良模式,确保代码的一致性和高质量。

通过配置ESLint的检查规则,我们可以让IDE自动去识别我们的代码是否符合规范,比如检查声明的变量名、语言层级的语法错误、甚至是特定框架的API使用规范(react-hook,可以检查诸如useEffect等 hook 的依赖数组是否存在问题)

一旦不符合配置的规则,ESLint就会抛出错误信息,从而去约束我们编写代码要遵从某些规范。同时也是帮我们做一次基本的代码检查,减少我们因疏忽大意导致的 bug,减轻我们复查代码的负担。

Pretter

Prettier 是一个专注于代码格式化的工具,它可以自动调整代码风格,使代码保持一致性和可读性。

PretterESLint

PretterESLint都是约束代码规范的工具,但它们的侧重点不一样。ESlint是能够去分析代码,从而去检查某些潜在的问题。但Pretter则是对代码进行格式化,不参与代码检查。 如果想检查不符合Pretter规则的信息,则需要通过插件将Pretter的规则录入ESLint去进行检查。

换句话来说,ESLint是能够分析代码逻辑的,从而去帮我们去提高代码质量。而Pretter则注重代码的格式化,从而让代码更美观、整洁,符合大家的阅读习惯。提高代码的可读性

Husky

在面对团队协作时,统一的代码规范尤为重要。除了在每一个项目中统一配置ESLintPretter之外,还需要使用Husky去补充。因为当团队成员提交代码时,他可能出于个人意愿又或者是疏忽了导致没有检查以及格式化就传上去了。

Husky 是一个用于增强 Git Hooks(Git钩子)的工具,它允许你在执行特定的 Git 操作时自动运行脚本。通过 Husky,你可以轻松地在项目中设置预提交(pre-commit)、提交消息(commit-msg)、预备推送(pre-push)等钩子,以自动化执行诸如代码格式化检查、单元测试、Lint 分析等任务。这有助于确保代码质量,并强制执行团队的编码标准和最佳实践。

通过Husky我们就能在提交代码时强制执行ESLint检查以及Pretter格式化,如果出现错误信息就不让提交上去。这样能够确保远程仓库里的代码是符合代码规范的,提高团队维护项目的代码质量。