【前端必会】Prettier，有了ESlint，还要Prettier

介绍

已经安装了ESLint为什么还要Prettier，主要是让ESLint专注于语法相关的验证，检查潜在问题。而代码格式化则有Prettier来接管

对比参考：

https://baijiahao.baidu.com/s?id=1718226261291810346&wfr=spider&for=pc

安装

npm install --save-dev --save-exact prettier

--save-exact 参考：https://blog.csdn.net/aaqingying/article/details/121209404

格式化

格式化前

执行.\node_modules\.bin\prettier ./scripts/index.js -w

的确有些变化，第3行没用的括号，多余的分号都被去掉了

VSCode格式化工具配置

安装vscode插件prettier-vscode



有好多，装星星多的。

装好后执行alt+shift+f



点击配置为Prettier



确定后代码也被格式化了



在格式化就不会弹配置默认的格式化工具了

默认规则参考

https://www.prettier.cn/docs/configuration.html

http://json.schemastore.org/prettierrc

疑问

1. ESLint那节我故意设置了字符串使用单引号的规则，这里默认使用Prettier进行格式化时，会自动变成双引号。也就是说格式化工具与ESlint有冲突。
   
   这是该怎么办呢？
   
   

2. 比如在代码提交到git前，执行ESLint的时候，如果有几个文件不符合Prettier的格式，这个时候又要怎么办呢？

总结

1. 此时Prettier和Eslint还不能友好的玩耍。
2. Prettier命令不常用，直接整合开发工具即可