在vue中使用ESLint

vue 62426 5年前 (2019-12-26) 941次浏览 2个评论 扫描二维码

ESLint 它的目标是保证代码的一致性和避免错误 ,对个人和团队都有很大的帮助

最开始项目中是没有使用eslint的,webpack安装的时候特意避开了,因为只要一配置代码直接全红(没有按照eslint配置文件里的规范来书写),然后看到别人安装vscode里面的ESlint插件后,代码自动按照想要的规范来格式化,看着舒服,也方便自己

ESLint配置方法:

最方便的就是用webpack安装的时候选择eslint,然后它会让你选择是使用其他人出名的配置表还是自己配置,这里我们选择自己配置,按照自己的喜好和习惯来自定义配置表比较推荐,使用其他人的不方便修改

安装好后,根目录多出 .eslintrc.js文件

使用其他第三方的配置放在 extends 里面

自定义的配置放在 rules 里面

然后下载ESLint插件,再在vscode设置里面的eslint 的 settings.json里面加上,一段 可以在 保存 时自动调整代码格式的 配置

配置ESLint完成,然后就有如下效果

题外话,如果像我一样在项目中途引入ESLint,配置起来比较麻烦。我是直接照着正常安装了ESLint的项目来配置的,分别安装了如下几个依赖

然后在webpack.base.config.js中加上如下片段

npm i 然后关了重进,配置完成。

我现在暂时用的是 掘金花裤衩 的配置表,之后肯定会根据自己的喜好和习惯有所改动


喜欢 (1)
[支付宝扫码,感谢支持]
分享 (0)
关于作者:

您必须 登录 才能发表评论!

(2)个小伙伴在吐槽
  1. 666
    dream2020-04-15 21:13