`eslint-config-prettier` 和 `eslint-plugin-prettier` 是用于与 ESLint 和 Prettier 集成的两个不同的包。
1. `eslint-config-prettier` :这是一个 ESLint 配置规则的包,它将禁用与 Prettier 冲突的 ESLint 规则。使用 `eslint-config-prettier` 可以确保 ESLint 规则与 Prettier 的代码格式化规则保持一致,避免二者之间的冲突。
2. `eslint-plugin-prettier` :这是一个 ESLint 插件,它将 Prettier 应用到 ESLint 中。它会使用 Prettier 来格式化代码,并将格式化结果作为 ESLint 的一项规则来检查代码。使用 `eslint-plugin-prettier` 可以在代码检查的同时,自动格式化代码,使其符合 Prettier 的规则。
通常情况下,您需要同时安装这两个包来实现 ESLint 和 Prettier 的集成。首先,使用 `eslint-config-prettier` 禁用与 Prettier 冲突的 ESLint 规则,然后使用 `eslint-plugin-prettier` 将 Prettier 应用到 ESLint 中,以便在代码检查时自动格式化代码。
下面是一个示例 `.eslintrc.js` 配置文件,展示了如何同时使用 `eslint-config-prettier` 和 `eslint-plugin-prettier` :
module.exports = { extends: ["eslint:recommended", "plugin:prettier/recommended"], plugins: ["prettier"], rules: { // 可以添加其他自定义规则 }, };
通过这样的配置,您可以同时享受到 ESLint 的代码检查功能和 Prettier 的代码格式化功能,并确保二者之间的规则一致性。