今天我们聊的东西vscode 中的这个东东:
在聊ESlint 插件之前我们先聊聊eslint .
啥是eslint,为啥要有eslint?
这个问题估计大多数人都知道,在我们写代码时每一个人的风格都不一样,有时候还会写错语法,那么如果提交到代码仓库,同组小伙伴估计要口吐芬芳了。eslint 就为我们提前先检查一下代码是否有风险。
我们只需要运行下npm run lint
,就会提示我们有哪些问题。这样就会有个问题,如果我们写了很多代码,当我们想提交时再去验证,如果发现一堆问题,估计我们内心也是万马奔腾。那么能不能当我们写代码那一时刻就提示我们说代码可能有问题?因此ESLint 插件就可以搞定
当我们使用Vue写项目时,我们需要下面几个步骤:
- 若是Vue2使用vetur, Vue3使用Volar
- 安装Eslint插件
- 只要安装这个插件,它会自动查找项目中的ESlint规则,给出验证提示
- 如何格式化?需要手动开启,preferences->settings->Exnsions->eslint.format.enable 勾选,就会开启格式化。
- 格式化操作有两种方式(个人不建议开启格式化,自己根据提示手动去改,会让我们养成代高质量的代码书写习惯):1.选择格式化的文件,右击,选择格式化方式,选Eslint; 2:在配置文件中配置一下,保存就可以格式化,
"editor.codeActionsOnSave": { "source.fixAll": true // 保存时使用eslint校验文件 },