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 天前
提交规范靠吼没用,看我用“shell+husky螺丝刀”,一键给40多个项目上锁
前端·eslint
wanna4 天前
eslint使用
eslint
去伪存真1 个月前
ESLint + Husky 如何只扫描发生改动的文件?
前端·eslint
孟陬2 个月前
利用 caniuse 结合 browserslist 对 JS 做兼容性检测
typescript·eslint·trae
USER_A0012 个月前
【VUE3】Eslint 与 Prettier 的配置
vue3·eslint·prettier
去伪存真2 个月前
给接手历史项目配置ESLint+Prettier,发现还是会踩坑
前端·eslint
卡列尼娜翠花3 个月前
vscode 导入语句排序和删除未使用的导入
前端·javascript·vscode·编辑器·eslint·前端工程化·esm
曾富贵3 个月前
【eslint 插件】导入语句排序
前端·eslint
bysking3 个月前
【24 Eslint 9.x插件】Eslint插件编写例子-bysking
前端·eslint
任磊abc3 个月前
nextjs15简要介绍以及配置eslint和prettier
eslint·nextjs·prettier·nextjs15