想法丨发现丨习惯
同道者同行 同行者同享
最近写了一个代码规范检测工具 code-lint(借鉴了前公司部门前端大佬开发的一个工具),能够通过 npm 直接安装和一份配置文件实现对项目的代码规范检测。
为什么要写这样的一个工具呢?
一是希望能够避免在多个项目中重复地去做代码规范配置;
二是希望能够使不同技术栈的项目都使用同一份代码规范配置;
在这个工具中的文档规范部分我参考了颜海镜大神的《8102年如何写一个现代的JavaScript库》这篇博文中所讲的开源库的规范,我觉得这篇博文对于想要开发并开源一个运行在浏览器端的工具库的童鞋有很大的启示意义和借鉴作用(我才不会说我以后也要借鉴这个库来开发工具库呢)。
那么,回到正题
这个项目的地址是:https://github.com/ttsy/code-lint
就让我们来看看这个代码规范检测工具是怎样的吧。
特性
基于 eslint 进行 js 代码规范检测
基于 stylelint 进行 css 代码规范检测
基于 stylelint-scss 对 scss 代码更加友好的规范检测
定向检测/修复文件
localdiff 检测/修复文件(基于 git)
介绍
目前,code-lint 只实现了对 js 以及 css 代码规范的检测,js 代码规范检测是基于 eslint 的,而 css 代码规范检测则基于 stylelint,由于配置了 stylelint-scss 插件,所以对 scss 代码的规范检测会更加友好。
js 代码检测仅包含后缀为 .html、.vue、.js 的文件,而 css 代码检测仅包含后缀为 .html、.vue、.css、.scss、less 的文件。
目前该工具包含了定向检测/修复以及localdiff 检测/修复功能。定向检测/修复仅检测/修复配置文件中所指定的文件;而 localdiff 检测/修复则是检测/修复当前 git 仓库中发生过修改的文件,该功能是基于 git 的。
使用指南
通过 npm 下载安装
定向检测/修复
检测配置文件中配置的文件
在根目录 package.json 文件中加入检测命令
lintTargetFiles 为检测目标文件,使用 glob 语法,在前面加上 ! 则表示忽略检测的文件。
运行检测命令检测或修复
localdiff 检测/修复
在根目录 package.json 文件中加入检测命令
运行检测命令检测或修复
检测规则
js 检测规则继承 eslint-config-standard(https://github.com/standard/standard/blob/master/docs/RULES-zhcn.md)中的规则,并可根据配置文件中 eslint.rules 参数添加检测规则。
css 检测规则继承 stylelint-config-standard(https://github.com/stylelint/stylelint-config-standard/blob/master/index.js)中的规则,可根据配置文件中 stylelint.rules 参数添加检测规则。
默认配置
听说好看的人都会关注我
领取专属 10元无门槛券
私享最新 技术干货