vscode vue html校验,VSCode环境下配置ESLint 对Vue单文件的检测

本文介绍了在VSCode环境下如何配置eslint进行代码检查，并介绍了如何对.vue单文件进行支持。

ESLint 安装

在工程根目录下，安装eslint及初始化

$ npm install eslint --save-dev

$ ./node_modules/.bin/eslint -- --init //会输出几个问题，指引配置eslint，我们选择通用方案即可

1.? How would you like to configure ESLint? Use a popular style guide

2.? Which style guide do you want to follow? Standard

3.? What format do you want your config file to be in? JavaScript

2.通过以上步骤会在根目录下生成.eslintrc.js文件

module.exports = {

"extends": "standard"

};

3.输入以下命令尝试对.js文件进行eslint检测和修复

./node_modules/.bin/eslint -- --fix /path/to/file.js

4.安装vscode插件 ESLint

该插件可以在编辑时自动进行eslint检测和保存修复等功能，免除频繁输入命令行，提高效率

安装完ESLint并重启vscode后,可以在VSCode中打开一个js文件，检查出错的地方就会有标红，且有eslint的提示。

设置保存时自动修复

打开vscode -> 首选项 ->设置

添加以下配置&#x