sunny-fe-lint
是我自用的配套 Lint 工具,可以为项目一键接入规范,保障项目的编码规范和代码质量。
规范 | Lint 工具 |
---|---|
JavaScript 编码规范 TypeScript 编码规范 Node 编码规范 |
ESLint |
CSS 编码规范 | stylelint |
Git 规范 | commitlint |
文档规范 | markdownlint |
在终端执行:
pnpm install sunny-fe-lint -g
安装完成后,可执行 sunny-fe-lint -h
以验证安装成功。
在项目根目录执行 sunny-fe-lint init
,即可一键接入规范,为项目安装规范 Lint
所需的依赖和配置。
具体会做以下事情:
-
安装各种依赖:包括
Linter
依赖,如 ESLint、stylelint、commitlint、markdownlint 等。 -
写入各种配置文件,包括:
-
.eslintrc
、.eslintignore
:ESLint 配置及黑名单文件 -
.stylelintrc、
.stylelintignore`:stylelint 配置及黑名单文件 -
.commitlintrc
:commitlint 配置 -
.markdownlint
、.markdownlintignore
:markdownlint
配置及黑名单文件 -
.prettierrc
:符合规范的 Prettier 配置 -
.editorconfig
:符合规范的 editorconfig -
.vscode/extensions.json
:写入规范相关的 VSCode 插件推荐 ,包括ESLint
、stylelint
、markdownlint
、prettier
等 -
.vscode/settings.json
:写入规范相关的 VSCode 设置 ,设置ESLint
和stylelint
插件的validate
及保存时自动运行 fix,如果选择使用Prettier
,会同时将prettier-vscode
插件设置为各前端语言的 defaultFormatter,并配置保存时自动格式化
-
-
配置 git commit 卡口:使用 husky 设置代码提交卡口
注 1:如果项目已经配置过 ESLint、stylelint 等 Linter,执行
sunny-fe-lint init
将会提示存在冲突的依赖和配置,并在得到确认后进行覆盖:注 2:如果项目的 .vscode/ 目录被 .gitignore 忽略,可以在拉取项目后单独执行
sunny-fe-lint init --vscode
命令写入.vscode/extensions.json
和.vscode/settings.json
配置文件
如果你的 TS 项目 commit 卡口和 sunny-fe-lint scan
运行时间很长,可以通过如下在 .eslintrc.js
中增加以下配置提升性能:
module.exports = {
parserOptions: {
project: [], // for lint performance
createDefaultProgram: false, // for lint performance
},
rules: {
'@typescript-eslint/dot-notation': 0, // for lint performance
'@typescript-eslint/restrict-plus-operands': 0, // for lint performance
},
};