foreword(前言)
最近突然发现我的项目在基于 eslint 做保存时的 code lint 时连续执行了两次 lint,而且第一次是好的,第二次又坏了。
solve(解决)
仔细检查了我的 settings.json 文件,发现其中有以下两个配置:
...
"editor.formatOnSave": true,
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
...
貌似这两条配置都是用于保存时 lint 的,而第二条配置里面包含 eslint 的文本,所以我把第一条配置给注释了,然后重新做 onSave lint,结果是好的。
所以验证了我心中的猜想:上面两条配置都会触发一次 lint,如果要用 eslint 做 lint,则只需要保留上面的第二条配置。
后面在 VS Code 的官网中查阅了 eslint 扩展的文档:
ESLint - Visual Studio Marketplacemarketplace.visualstudio.com发现了有以下一段话:
The oldeslint.autoFixOnSave
setting is now deprecated and can safely be removed. Please also note that if you use ESLint as your default formatter you should turn offeditor.formatOnSave
when you have turned oneditor.codeActionsOnSave
. Otherwise your file gets fixed twice which in unnecessary.
也印证了我的猜想。
解决了 lint 两次的问题之后,我发现纯 html 文件又不能被格式化了。。。
。
。
。
经过一段时间的资料查阅与尝试,我发现只要 editor.formatOnSave":true
存在,html 文件就可以被格式化,但又为了避免与editor.codeActionsOnSave
冲突,可以以以下方式进行配置:
{
...
// 设置默认的js格式化工具
"[javascript]": {
"editor.defaultFormatter": "dbaeumer.vscode-eslint"
},
// 设置默认的json格式化工具
"[json]": {
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnSave": true
},
"[jsonc]": {
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnSave": true
},
// 设置默认的scss格式化工具
"[scss]": {
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnSave": true
},
// 设置默认的html格式化工具
"[html]": {
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnSave": true
},
...
}
也就是对非 eslint fix 的文件配置"editor.formatOnSave":true
即可,VS Code 针对"[language]": { ... }
的格式设置了一个 scope
,因此可以避免跟上一层配置的 editor.codeActionsOnSave
冲突。
以上是我对今天才的坑的记录总结!!!
last(最后)
非常感谢您能阅读完这篇文章,您的阅读是我不断前进的动力。
对于上面所述,有什么新的观点或发现有什么错误,希望您能指出。
最后,附上个人常逛的社交平台:
知乎: https://www. zhihu.com/people/bi-an- yao-91/activities
csdn: https:// blog.csdn.net/YaoDeBiAn
github: https:// github.com/yaodebian
个人目前能力有限,并没有自主构建一个社区的能力,如有任何问题或想法与我沟通,请通过上述某个平台联系我,谢谢!!!