VSCode配置eslint自动缩进（格式化代码）

配置基于 VSCode v1.41.0 以上版本

1. 打开vscode配置文件 settings.json

{
	//自动缩进的开关 （关键配置），设置为true则打开自动缩进
	"editor.codeActionsOnSave": {
	  "source.fixAll.eslint": true
	},
	"eslint.format.enable": true,
	// 规定的文件类型 这里不是必要的
	"eslint.validate": ["javascript", "vue", "html"]
}

2. 打开项目根文件夹下的 .eslintrc.js

这个配置是决定你 缩进几个空格
在 rules 下配置

module.exports = {
	rules:{
		// 解决let被强转为const问题
		"prefer-const": 0,
		// 保存代码时缩进4个空格
		"indent": ['error', 4],
	}
}

配置完保存就可以了，试一下吧！

这里还有个地方也可以配置缩进，
但是优先级没有 .eslintrc.js 里的高

打开根文件夹下的 .editorconfig 文件
在文件中配置 indent_size 字段

#控制 .editorconfig 是否生效
root = true
#匹配的文件类型
[*.{js,jsx,ts,tsx,vue}]
#缩进风格：空格
indent_style = space
# 这里一般默认是 2，改成4就能缩进4个空格了
indent_size = 4
#换行符lf
end_of_line = lf
#字符集utf-8
charset = utf-8
#是否删除行尾的空格
trim_trailing_whitespace = true
#是否在文件的最后插入一个空行
insert_final_newline = true

总结：
.editorconfig 不光可以检验 js 文件的代码风格，还可以对 .py（python 文件）、.md（markdown 文件）进行代码风格控制。
Eslint 和 .editorconfig 并不冲突，同时配合使用可以使代码风格更加优雅。

希望这篇帖子能帮到你！