vue&react质检工具(eslint)安装使用总结

1 、ESLint

ESLint工具主要类似java中的checkStyle和findbugs,是检查代码样式和逻辑规范的工具。

1.1 、ESLint安装流程

打开VSCode软件,打开扩展中心,下载ESLint插件

图1.1

点击后面的install按进行安装,如图1.2所示:

图1.2

在详情页启用插件服务,如图1.3所示:

图1.3

打开默认配置,准备在后面加上ESLint配置信息:

图1.4

点击此按钮打开默认配置文件

图1.5

注意在原文件最后加逗号,换行紧跟ESLint配置信息,如图1.6所示:

图1.6

接配置好后,如果想要看中文检查结果信息,调整如图所示:

图1.7

重启VSCode,重启后打开任意文件,查看软件右下方是否存在ESLint

图1.8

1.2 、ESLint使用流程

点击某个文件后,再点击右下方的ESLint插件,打开PROBLEMS选项,看有哪些问题需优化

如果右下方没有出来ESLint,可以尝试打开扩展中心后按如下三步操作进行后重启VSCode:

相关推荐
前端工作日常2 天前
我理解的eslint配置
前端·eslint
若梦plus3 天前
Eslint中微内核&插件化思想的应用
前端·eslint
前端工作日常6 天前
ESLint 配置深度解析:parserOptions、env 和 flowtype 的核心作用与实战指南
typescript·eslint
前端工作日常6 天前
我学习到的ESLint 配置中root作用
eslint
angelQ11 天前
针对"@antfu/eslint-config": "^4.17.0"最新版本使用报错Unexpected token 'with'的解决方法
前端·eslint
jason_yang15 天前
代码规范-3大利器 prettier eslint husky
代码规范·eslint
拾光拾趣录19 天前
ESLint:从代码扫描到自动修复
前端·eslint
namehu23 天前
从 ESLint 到 Oxlint:一次提速百倍的前端 Lint 工具链升级实战
前端·javascript·eslint
光头程序员2 个月前
自定义 eslint 规则
eslint
non_hana2 个月前
一些 linter & formatter 配置最佳实践
typescript·node.js·eslint