【前端必会】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
疑问
-
ESLint那节我故意设置了字符串使用单引号的规则,这里默认使用Prettier进行格式化时,会自动变成双引号。也就是说格式化工具与ESlint有冲突。
这是该怎么办呢?
![]()
-
比如在代码提交到git前,执行ESLint的时候,如果有几个文件不符合Prettier的格式,这个时候又要怎么办呢?
总结
- 此时Prettier和Eslint还不能友好的玩耍。
- Prettier命令不常用,直接整合开发工具即可


浙公网安备 33010602011771号