解决 VSCode 编辑 vue 项目报错 Expected indentation of 2 spaces but found 4

• 解决 VSCode 编辑 vue 项目报错 Expected indentation of 2 spaces but found 4
• 问题
• 问题分析
• 解决办法一
• 解决办法二

解决 VSCode 编辑 vue 项目报错 Expected indentation of 2 spaces but found 4

系统：Win10
编辑器：VSCode

问题

使用 VSCode 在写 Vue 项目的时候，出现报错
Expected indentation of 2 spaces but found 4

问题分析

明显从图中可以以看出问题是使用 ESLint 插件导致的
作为一个代码规范插件，ESLint 限定缩进是 2 个空格，而我们一般使用 Tab 键的缩进是 4 个空格

解决办法一

关闭 ESLint 这个检查规则
打开 .eslintrc.js 配置文件，加入一行配置 “indent”:[“off”,2]
然后我们就可以看到原来的报错没有了

当然，既然我们使用代码规范插件，一般来说我们应当适应这种规范的写法，所以我们也可以将我们的 Tab 的缩进改为 2

解决办法二

我们打开 VSCode 的设置页面，在搜索框中输入 Tab Size，将用户区和工作区的 Tab Size 均设置为 2

然后我们进入报错页面，点击下方的 空格4，然后选择更改视图

在这里选择 2 即可

最后再用 Shitf+Tab 向左恢复缩进至正常即可