diff --git a/README.md b/README.md index 64e57912a1..feb99684c2 100644 --- a/README.md +++ b/README.md @@ -374,7 +374,7 @@ module.exports = [ | [no-unsafe](docs/rules/no-unsafe.md) | Disallow usage of unsafe lifecycle methods | | ☑️ | | | | | [no-unstable-nested-components](docs/rules/no-unstable-nested-components.md) | Disallow creating unstable components inside components | | | | | | | [no-unused-class-component-methods](docs/rules/no-unused-class-component-methods.md) | Disallow declaring unused methods of component class | | | | | | -| [no-unused-prop-types](docs/rules/no-unused-prop-types.md) | Disallow definitions of unused propTypes | | | | | | +| [no-unused-prop-types](docs/rules/no-unused-prop-types.md) | Disallow definitions of unused propTypes | | | 🔧 | | | | [no-unused-state](docs/rules/no-unused-state.md) | Disallow definitions of unused state | | | | | | | [no-will-update-set-state](docs/rules/no-will-update-set-state.md) | Disallow usage of setState in componentWillUpdate | | | | | | | [prefer-es6-class](docs/rules/prefer-es6-class.md) | Enforce ES5 or ES6 class for React Components | | | | | | diff --git a/docs/rules/no-unused-prop-types.md b/docs/rules/no-unused-prop-types.md index 66d23b8cdb..34e666ac9b 100644 --- a/docs/rules/no-unused-prop-types.md +++ b/docs/rules/no-unused-prop-types.md @@ -1,5 +1,7 @@ # Disallow definitions of unused propTypes (`react/no-unused-prop-types`) +🔧 This rule is automatically fixable by the [`--fix` CLI option](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix). + Warns if a prop with a defined type isn't being used. diff --git a/lib/rules/no-unused-prop-types.js b/lib/rules/no-unused-prop-types.js index a3cf352aac..dedcb9c3e7 100644 --- a/lib/rules/no-unused-prop-types.js +++ b/lib/rules/no-unused-prop-types.js @@ -30,7 +30,7 @@ module.exports = { recommended: false, url: docsUrl('no-unused-prop-types'), }, - + fixable: 'code', // Indicate that this rule supports automatic fixing messages, schema: [{ @@ -138,6 +138,23 @@ module.exports = { data: { name: prop.fullName, }, + fix: (fixer) => { + const propNode = prop.node; + if (propNode) { + const sourceCode = context.getSourceCode(); + const commaToken = sourceCode.getTokenAfter(propNode, { + filter: (token) => token.type === 'Punctuator' && token.value === ',', + }); + const fixes = []; + // Remove the comma after the propNode if it exists + if (commaToken) { + fixes.push(fixer.remove(commaToken)); + } + // Remove the propNode itself + fixes.push(fixer.remove(propNode)); + return fixes; + } + }, }); }