VsCode配置的Eslint编写代码和保存时不生效

码龄7年

关注

原创 2022-11-08 17:30:43 2.8k 阅读

【问题记录】vscode eslint 自动保存不生效 vscode保存文件时eslint自动格式化不生效，百思不得其解，网上搜索了一大堆教程都没有解决问题. 阅读详情

第一次手动配置Eslint，记录一下踩过的坑

第一步：在VsCode中安装Eslint插件
在这里插入图片描述
第二步：按照官网教程安装Eslint

第三步：按f1，输入eslint，点击下图，当我们输入第二步中的第三行命令行将会在终端出现Eslint信息

第四步：输入第二步中的第三行命令行，终端显示了错误信息
终端中出现了错误信息
到此证明，Eslint配置成功，但是我发现我在编写代码时，并没有按照配置文件中配置的来提示我错误，正常来说会出现红色波浪线来提示用户发生了错误

最后发现坑居然是我的VsCode版本太旧了在这里插入图片描述

继续解决问题——更新VsCode，又出现了问题

在这里插入图片描述
解决方案如下：将VS Code 安装目录下的 Code.exe 文件复制到C:\Program Files\Microsoft VS Code

Vscode更新后，出现了红色波浪线和提示
在这里插入图片描述
第五步：在setting.js中加入以下代码，保存时即可自动格式化

// 一键修复
  "editor.codeActionsOnSave": {
        // For ESLint
        "source.fixAll.eslint": true,
        // For TSLint
        "source.fixAll.tslint": true,
        // For Stylelint
        "source.fixAll.stylelint": true,
        "source.fixAll.markdownlint": true,
    },

"editor.formatOnSave": true,
"eslint.format.enable": true

右键点击并选择Eslint
在这里插入图片描述

收录于

misc

标签

#vscode #前端

本内容遵循 CC 4.0 BY-SA 版权协议

给Vscode配置ESlint语法检查 — ESLint 插件自动格式化设置（实现Ctrl+S 按照ESLint规则自动格式化代码）实现按照ESLintESLint（读取ESLint配置文件进行语法检测）—主要Prettier（代码格式化工具）vetur vue代码高亮本文主要通过VScode中的ESLint插件进行配置，代码规范是很重要的。这样做不仅可以很大程度地避免基本语法错误，也保证了代码的可读性。这里使用的开发工具是vscode，配合eslint来对项目进行格式校验，本文vue项目添加配置。给Vscode配置ESlint语法检查；ESLint 插件自动格式化设置（实现Ctrl+S 按照ESLint规则自动格式化代码）...... 阅读详情

VsCode配置的Eslint编写代码和保存时不生效

第一次手动配置Eslint，记录一下踩过的坑

相关推荐