vscode vue es6语法配置检测

最新推荐文章于 2025-06-20 13:55:08 发布

原创最新推荐文章于 2025-06-20 13:55:08 发布 · 置顶 · 2.2w 阅读

33 ·

CC 4.0 BY-SA版权

文章标签：

#vscode es6语法配置检测 #vue #vscode+eslint前端代码规范

爬坑问题记录~分享同时被 2 个专栏收录

25 篇文章

订阅专栏

Vue

14 篇文章

订阅专栏

本文详细介绍如何在VSCode中配置ESLint插件，实现ES6语法的自动检测及修复，包括插件安装、配置文件创建及用户设置修改，适用于前端开发人员。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

话说，为了配置vscode，es6语法自动检测，百度的各种攻略，踩坑不少，最重要还没用。。。。。。将最后解决的方法分享大家，共同进步！

配置方法：

1. 插件下载 ESLint，JavaScript(ES6) code snippets

打开vscode —点击右侧扩展商店—搜索框输入es,找到以下2个插件，ESLint，JavaScript(ES6) code snippets 分别点击安装，下面贴图：

2. 重点！！！检查项目根目录下里是否有名为 .eslintrc.js 的配置文件，有则直接进入以下第3步。

没有配置文件，在项目根目录下创建2个配置文件.eslintrc.js， .eslintignore ，配置参考链接：

使用 VSCode + ESLint 实践前端编码规范

优雅地使用 VSCode 来编辑 vue 文件

3. 用户配置项修改

文件-----首选项-----设置，打开后，搜索框输入es，用户配置里，添加如下代码：

代码：

{
   
 "eslint.validate": [
 "javascript",
 "javascriptreact",
 {
  "language": "html",
  "autoFix": true
 },
 {
  "language": "vue",
  "autoFix": true
 }
],
"eslint.autoFixOnSave": true,
"explorer.confirmDragAndDrop": false,
"editor.detectIndentation": false,
"editor.tabSize": 2,
"vetur.format.defaultFormatter.js": "none"
}

全部配置完成后，重启vscode,新建vue文件，会发现es6自动检测功能已经有啦！