prettier-eslint、eslint-plugin-prettier 和 eslint-config-prettier 有什么区别？

小编典典

all

我想同时使用 Prettier 和 ESLint，但是我一个接一个地使用它们就遇到了一些冲突。我看到这三个包似乎允许它们串联使用：

但是，我不确定使用哪个包名，因为这些包名都包含eslintand prettier。

我应该使用哪个？

阅读 112

2022-08-24

共1个答案

小编典典

tl; dr：使用eslint-config-prettier，您可以忽略其余部分。

ESLint 包含许多规则，与格式相关的规则可能与 Prettier 冲突，例如arrow-parens,space-before-function- paren等。因此将它们一起使用会导致一些问题。已经创建了以下工具来一起使用 ESLint 和 Prettier。

	[`prettier-eslint`](https://github.com/prettier/prettier-eslint)	[`eslint-plugin-prettier`](https://github.com/prettier/eslint-plugin-prettier)	[`eslint-config-prettier`](https://github.com/prettier/eslint-config-prettier)
这是什么	导出单个函数的 JavaScript 模块。	一个 ESLint 插件。	一个 ESLint 配置。
它能做什么	`prettier`通过then运行代码（字符串）`eslint --fix`。输出也是一个字符串。	插件通常包含 ESLint 将检查的附加规则的实现。这个插件在后台使用 Prettier，当你的代码与 Prettier 的预期输出不同时会引发 ESLint 错误。	此配置关闭可能与 Prettier 冲突的格式相关规则，允许您将 Prettier 与其他 ESLint 配置（如[`eslint-config- airbnb`](https://www.npmjs.com/package/eslint-config-airbnb).
如何使用它	在您的代码中调用该函数，或者[`prettier-eslint-cli`](https://github.com/prettier/prettier- eslint-cli)如果您更喜欢命令行，则可以通过该函数调用。	将其添加到您的`.eslintrc`.	将其添加到您的`.eslintrc`.
最终输出 Prettier 是否兼容？	取决于你的 ESLint 配置	是的	是的
您需要`prettier`单独运行命令吗？	不	不	是的
你需要使用其他东西吗？	不	您可能希望使用`eslint-config-prettier`.	不

有关详细信息，请参阅Prettier 官方文档。

推荐的做法是让 Prettier 处理格式化和 ESLint 处理非格式化问题，prettier- eslint与该做法的方向不同，因此prettier-eslint不再推荐。可以eslint-plugin-prettier和eslint- config-prettier一起使用。

2022-08-24