首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

开源一个代码规范检测工具

想法丨发现丨习惯

同道者同行 同行者同享

最近写了一个代码规范检测工具 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 参数添加检测规则。

默认配置

听说好看的人都会关注我

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20181220A1I32O00?refer=cp_1026
  • 腾讯「腾讯云开发者社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 cloudcommunity@tencent.com 删除。

扫码

添加站长 进交流群

领取专属 10元无门槛券

私享最新 技术干货

扫码加入开发者社群
领券