1.0.2 • Published 3 years ago
eslint-config-icinfo v1.0.2
概述
配合vscode,按照自定义的eslint规则,保存格式化vue项目,请确保vscode已安装eslint&prettier插件
安装
$ npm install eslint-config-icinfo -D
如果缺失以下包请继续安装
$ npm install @typescript-eslint/parser@4.18.0 @typescript-eslint/eslint-plugin@4.18.0 eslint-plugin-prettier@3.1.4 prettier@1.19.1 typescript@4.1.6 --save-dev
使用方法
配合vscode
以及prettier
实现保存自动修复
配置文件
在项目根目录下新建文件.eslintrc.js
module.exports = {
parserOptions: {
parser: '@typescript-eslint/parser',
},
extends:['icinfo']
}
在项目根目录下新建文件.vscode/settings.json
{
"editor.detectIndentation": false,
"eslint.enable": true,
// 重新设定tabsize
"editor.tabSize": 4,
// #每次保存的时候自动格式化
"editor.formatOnSave": false,
// #每次保存的时候将代码按eslint格式进行修复
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
//"source.fixAll.stylelint": true
},
}
在项目根目录下新建文件.prettierrc.js
/* 官网:https://prettier.io/docs/en/options.html */
module.exports = {
semi: false, // 尽可能不要分号
singleQuote: true, // 尽可能使用单引号
trailingComma: 'all', // 尽可能使用尾随逗号,参考:http://es6.ruanyifeng.com/#docs/style#对象
endOfLine: 'lf'
}
在项目根目录下新建文件.editorconfig
root = true
[*]
charset = utf-8
indent_style = space
indent_size = 4
end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true
使用
执行以下命令即可:
$ eslint dir/**.js
如果需要自动格式化代码,在执行时添加--fix
选项:
$ eslint dir/**.js --fix
常见问题
1、如果在使用babel-eslint
时报错,可能是该模块的 Bug,目前可以通过以下方法解决:
module.exports = {
parser: 'babel-eslint',
parserOptions: {
sourceType: 'module',
allowImportExportEverywhere: false,
},
extends: 'lei',
rules: {
// 关闭以下规则
'generator-star-spacing': 'off',
'require-yield': 'off',
},
};
2、在使用过程中,可能会遇到一些例外情况,比如需要更改参数对象的属性,可以通过eslint-disable-next
来临时关闭对下一行的检查:
// eslint-disable-next-line no-param-reassign
param.xxx = 'ok';
注意:任何时候请勿使用eslint-disable
来关闭eslint
的检查,如果该备注不能与eslint-enable
成对出现将会导致余下的程序不能正常获得检查
3、检查 HTML 文件内的 script 标签:
需要执行以下命令安装eslint-plugin-html
插件:
$ npm install eslint-plugin-html --save-dev
并修改文件.eslintrc.js
,载入eslint-plugin-html
插件:
{
plugins: [ 'html' ],
}
在 HTML 文件中,<script>
标签需要包含type="text/javascript"
,比如:
<script type="text/javascript">
var a = 10;
</script>
由于eslint
命令默认只会检查.js
后缀的文件,所以需要在执行命令时指定.html
后缀,比如:
$ eslint --ext .js,.html . --fix
1.0.2
3 years ago