前言
随着前端技术的日益发展，代码质量的提高成为了每一个前端开发者不可回避的问题，不同开发者之间会遇到许多细节上的差异，为了达成代码质量的统一，实现更高效，更快速的开发周期，使用代码检查工具就成为了必经之路。npm包uba-lint是一款非常实用的前端代码检查工具，本文就带领读者探索uba-lint的使用方法。
为什么要使用uba-lint？
- 代码检查：uba-lint支持各类文件及文件夹检查，并且会对不符合规范的代码做出提示，降低代码出现错误的概率。
- 规范化编码：uba-lint支持配置不同的校验规则及文件类型，支持自定义规则，可根据不同项目代码风格需求定制化规则，规范新项目的开发。
- 提高开发效率：uba-lint支持快速检查代码，并提供检查反馈信息，减少代码的debug时间，提高开发效率。
安装
$ npm install uba-lint -D
使用说明
工程配置
在工程的根目录下创建.rulesrc文件，并配置相应的规则，以便校验文件。
常用配置项：
- 忽略文件配置 exclude：配置规则的文件不进行校验
-- -------------------- ---- ------- - ---------- - ----------------- --------- ------------------- --------------- -------------- - -- 检验文件配置 include：仅对 include 下文件格式的文件进行校验
{ "include": [ "**/*.js", "**/*.jsx", "**/*.less", "**/*.scss" ] }- 执行定制化工具配置 plugin：
{ "plugin": [ "uba-lint-plugin-react" ] }自定义规则配置：.eslintrc
可参考eslint官网的规则配置， 根据自己的代码需求，制定符合自己的规范，提高代码的质量。
命令行
在package.json文件中设置npm script
{
"scripts": {
"lint": "uba-lint src/ --eslintrc .eslintrc --rules ./.rulesrc"
}
}配置完后，即可执行npm run lint 命令，检验src/下的文件，并返回校验结果。
自定义
- .eslintrc 文件规则定制： eslint.org
- 自定义规则类别： TypeScript是否禁用console.log
示例代码
配置 <project root> 下 .rulesrc 文件
-- -------------------- ---- ------- - ---------- - ----------------- --------- ------------------- --------------- -------------- -- ---------- - ---------- ----------- ------------ ------------ ---------- ---------- - -配置 <project root> 下 .eslintrc.js 文件
-- -------------------- ---- ------- -------------- - - -------- - ------------------------- ------------------------------ ------------------------------- -- ------ - ----------- ---------- ------------------- --------- ------------------------------------------ ----- ---------------------------------------- ---- - -
scripts中添加命令
"scripts": { "lint": "uba-lint src/ --eslintrc .eslintrc.js --rules ./.rulesrc" }执行命令
npm run lint
返回结果
-- -------------------- ---- ------- - -------- ---- ---------- ------------ ------- ---------- ---------------------------------- ---- ----- ------------ -- ------- --- ----- ----- -------------- ----- ----- ---------- -- --- -------- -------- ----- ----- ------- -- --- -------- -------- ----- ----- ----------------- -- --- -------- -------- ----- ----- --------------- -- --- -------- -------- ------ ----- -------- -- ---------- -- -------- ---- --- ------- --- -- ---------- --------------------- ------ ----- ---------- --- -- -------- ----------------------- ------ ----- ---- ------ --- - ---------- -- -- -------- -------- -- -- ---- ------- ---------- ---------------------- ---------------------------------- ------ ----- ------------------- -- --- -------- -------- ------ ----- ------ --- --------- -- --- -- --- ----- ----------- - -- -------- --- ------- - ---------
结尾
除了能够使用uba-lint进行代码检查之外，通过编写代码规范，每个人都可以贡献自己的力量，共同将项目代码维护好。希望这篇文章能够在您的一些实际工作中带来技术上的困难和疑虑，同时也希望您能够探索更多2020年前端的新技术和实践！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005664d81e8991b448e26f9