安装
- cnpm i eslint -D
- npx eslint --init 初始化配置文件
- npx eslint *.js 检查项目所有js
- npx eslint *.js --fix自动修复代码风格问题
- 配置注解 //eslint-disable-line + 具体rule 禁用某个规则
gulp中集成eslint
- 安装eslint gulp-eslint
- 配置文件添加$ 防止找不到jquery全局标识
globals: {
"jQuery": "readonly"
}
.pipe(plugins.eslint())
.pipe(plugins.eslint.format()) //打印错误
.pipe(plugins.eslint.failAfterError()) //检查错误终止
webpack 中eslint
{
test: /\.js$/,
exclude: /node_modules/,
use: 'eslint-loader',
enforce:"pre" //优先级最高
},
ts
- cnpm i typescript
- cnpm i eslint
- 初始化eslint配置文件
stylelint
- cnpm i stylelint -D
- 添加配置文件 .stylelintrc.js
- cnpm i stylelint-config-standard
- npx stylelint *.css
module.exports = {
extends:"stylelint-config-standard"
}
prettier
- 代码格式化
- cnpm i prettier
- npx prettier 文件名 --write 格式化文件
Git Hooks
- git 钩子
- .git/hooks pre-commit文件（shell脚本）为commit前置钩子，提交前触发
- eslint结合git hooks
- 不使用shell使用hustry模块来实现 cnpm i husky -D
- package.json 定义 "husky " :{"hooks":{"pre-commit":"npm run pre-commit"}}
- scripts 设置test命令 "eslint ./index.js"
- cnpm i lint-staged -D
- package.json设置 lint-staged:{ "*.js":["eslint","git add"]}
- script 设置pre-commit: "lint-staged"
