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

时间:2024-03-31 15:15:10

解决 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
解决 VSCode 编辑 vue 项目报错 Expected indentation of 2 spaces but found 4

问题分析

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

解决办法一

关闭 ESLint 这个检查规则
打开 .eslintrc.js 配置文件,加入一行配置 “indent”:[“off”,2]
然后我们就可以看到原来的报错没有了
解决 VSCode 编辑 vue 项目报错 Expected indentation of 2 spaces but found 4
当然,既然我们使用代码规范插件,一般来说我们应当适应这种规范的写法,所以我们也可以将我们的 Tab 的缩进改为 2

解决办法二

我们打开 VSCode 的设置页面,在搜索框中输入 Tab Size,将用户区和工作区的 Tab Size 均设置为 2
解决 VSCode 编辑 vue 项目报错 Expected indentation of 2 spaces but found 4
然后我们进入报错页面,点击下方的 空格4,然后选择更改视图
解决 VSCode 编辑 vue 项目报错 Expected indentation of 2 spaces but found 4
在这里选择 2 即可
解决 VSCode 编辑 vue 项目报错 Expected indentation of 2 spaces but found 4
最后再用 Shitf+Tab 向左恢复缩进至正常即可
解决 VSCode 编辑 vue 项目报错 Expected indentation of 2 spaces but found 4