May 1, 2025
Prettier 与 ESLint
开始#
在写本网站时我曾对 Prettier 和 ESLint 的混合使用感到困惑,在查了相关资料后,我在项目 README.md 中这样记述:
Is Prettier Feature Conflicting with ESLint?#
Prettier 的功能和 ESLint 冲突了吗?#
While configuring tools to improve code quality, I was unsure whether I should use Prettier or ESLint for handling the sorting of imports, properties, and Tailwind CSS classes.
在使用配置工具提高代码质量的过程中,我不太确定该使用 Prettier 还是 ESLint 来处理导入、属性和 Tailwind CSS 类名的排序。
Although Prettier plugins like prettier-plugin-tailwindcss and prettier-plugin-sort-imports can address this, I don't consider them the "best practice".
虽然一些 Prettier 插件如 prettier-plugin-tailwindcss 和 prettier-plugin-sort-imports 能处理,但我不认为他们是“最佳实践”。
As discussed in this GitHub Issue and this Reddit Post, sorting can introduce side effects. Therefore, it's better to handle sorting with ESLint.
据这个 GitHub Issue 和这个 Reddit 帖子 讨论的内容,排序会引入副作用,因此更适合使用 ESLint 来处理排序。
Moreover, Prettier will not warn you about incorrect order, but ESLint will, as this is exactly what ESLint is supposed to do.
不仅如此,Prettier 不会警告你错误的排列顺序,但 ESLint 会,因为这正是一个 ESLint 该做的。
再思考#
根据 此博客 的记述,Prettier 和 ESLint 确实“并没有让你的生活变得更简单”,相反,为了处理它们之间的冲突,你需要花费更多的时间来配置它们。
所以以后我会考虑使用 ESLint 来处理所有的代码格式化问题。