webstorm、vscode、HBuilder配置eslint检查

你们好,我是金金金。

场景

每个人写的代码都有自己所属的风格,所以项目中统一代码风格特别重要,新开的项目中如何快速配置ESLint呢?

安装

  1. npm install --save-dev eslint ----安装eslint
  2. npm install --save-dev eslint-plugin-vue ------检测.vue文件里的js
  3. npm install --save-dev @typescript-eslint/eslint-plugin ------ ts
  4. npm install --save-dev @typescript-eslint/parser ------ ts

初始化配置

npx eslint --init

  • 随后会出现一些配置项让你选择,根据项目需求对应选择就好,完成后会在当前项目的根目录下自动生成.eslintrc.js文件,随后你在里面配置对应的规则即可

以下是我配置的一些简单规则

vscode怎么开启eslint检测?

  1. 下载ESLint插件

这里有个大坑,我刚开始安装的最新版本的,配置好了 始终没效果,检查了许久,在群里面问了大佬才知道新版本有这个坑,退回上一个版本就好了,我安装的是2.4.2版本的

  1. 测试如下,就是成功了。配置生效
  • 这里再推荐一个插件,显示错误信息在当前代码后,更直观

WebStorm怎么开启ESLint检测?

HBuilde怎么开启ESLint检测?

  1. 插件安装,eslint-js、eslint-plugin-vue、stylelint、htmlhint
  1. 配置
  1. 测试
  • 编写有误还请大佬指正,万分感谢。
相关推荐
小蕾Java8 小时前
PyCharm 软件使用各种问题 ,解决教程
ide·python·pycharm
pu_taoc9 小时前
深入剖析:基于epoll与主从Reactor模型的高性能服务器设计与实现
服务器·c语言·c++·vscode
周杰伦_Jay14 小时前
【Git操作详解】Git进行版本控制与管理,包括分支,提交,合并,标签、远程仓库查看
大数据·ide·git·科技·分类·github
小二·15 小时前
mac下解压jar包
ide·python·pycharm
YoungHong199221 小时前
一行配置解决claude code 2.0版本更新后 vscode 插件需要登录的问题
ide·vscode·编辑器
Blue桃之夭夭21 小时前
git和VScode
ide·git·vscode
蜀中廖化1 天前
python VSCode中报错 E501:line too long (81 > 79 characters)
开发语言·vscode·python
shimly1234561 天前
vscode 指定连接其它版本的 linux
ide·vscode·编辑器
___波子 Pro Max.2 天前
VS Code文件监视排除设置详解
vscode
苏苏码不动了2 天前
Android Studio 虚拟机启动失败/没反应,排查原因。提供一种排查方式。
android·ide·android studio