大家是否像我一样苦 ESlint 久已呢?只是配置一个代码格式化工具,动辄10几个依赖。依赖之间又相互依赖,版本错误,配置顺序错误都会导致失效。
就算熟练掌握了 ESLint 配置,但是换了项目,又要重新配置。如果是从React切换到Vue项目,情况会更糟糕,你不得不额外做一些无意义的配置工作。而我今天带来的 @youngjuning/eslint-config-airbnb 便是用来把你从繁琐的 ESLint 配置工作中解放出来的一款插件。
介绍
一款基于 airbnb 的强大的 eslint 配置插件,支持 vue、jsx、js、ts、tsx、html、jest,致力于把你从繁琐的 ESLint 配置工作中解放出来。
安装
首先,为了避免冲突,请移除项目中已存在的配置,你可以保留 rules
$ yarn add -D @youngjuning/eslint-config-airbnb
配置
Add to your eslint config (.eslintrc.js
):
module.exports = {
root: true,
extends: '@youngjuning/airbnb',
}
react native
module.exports = {
root: true,
extends: '@youngjuning/airbnb',
env: {
'react-native/react-native': true,
},
}
vue with typescript
module.exports = {
root: true,
extends: '@youngjuning/airbnb',
parserOptions: {
parser: '@typescript-eslint/parser',
},
}
更多
.eslintignore
!.eslintrc.js
!.prettierrc.js
.prettierrc.js
module.exports = {
...require('@youngjuning/eslint-config-airbnb/.prettierrc.js'),
}
.prettierignore
**/node_modules/*
.editorconfig
# EditorConfig is awesome: http://EditorConfig.org
# top-most EditorConfig file
root = true
# Unix-style newlines with a newline ending every file
[*]
indent_style = space
indent_size = 2
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true
[*.md]
trim_trailing_whitespace = false
[*.gradle]
indent_size = 4
[BUCK]
indent_size = 4
yorkie & lint-staged
$ yarn add -D yorkie lint-staged
{
"gitHooks": {
"pre-commit": "lint-staged"
},
"lint-staged": {
"*.{js,jsx,ts,tsx}": [
"eslint --fix",
"git add"
],
// you can add wxml/html...
"*.{less,md,json}": [
"prettier --write",
"git add"
]
},
}
本文首发于杨俊宁的博客,创作不易,您的点赞👍是我坚持的动力