Hey PatternFly-React devs! pf-codemods
is an eslint wrapper to update @patternfly/[email protected] code to 6.x.x.
We hope these rules and their autofixers will help you more quickly adopt our breaking changes. These rules are not designed to fix all build errors, but they can help to fix easy ones as well as point out the more complicated ones and offer suggestions on how you might go about fixing them.
If you have any hardcoded Patternfly class names in your project (i.e. pf-c-button) you also might want to see if our class-name-updater package would be helpful for you.
Requires Node.js >= 10.
npx @patternfly/pf-codemods ./path-to-src
Giving node more RAM can help for large codebases.
NODE_OPTIONS=--max-old-space-size=4096 npx @patternfly/pf-codemods ./path-to-src
These commands will show you places in your code that may have issues with our breaking changes similar to linting. Add the --fix
flag to allow us to autofix issues where possible.
Usage: pf-codemods [options] <path> [otherPaths...]
Run codemods on path using eslint.
Options:
-V, --version output the version number
--only <rules> Comma-seperated list of rules to run
--exclude <rules> Run recommended rules EXCLUDING this comma-seperated list
--fix Whether to run fixer
--format <format> What eslint report format to use (default: "stylish")
-h, --help display help for command
These rules are based off the breaking change notes for React. Each rule links the breaking change patternfly-react PR in case you want to better understand the change. Also, each rule makes sure you're using a PatternFly component before running.
Some rules will add either a comment (/* data-codemods */
) or data attribute (data-codemods="true"
) in order to prevent certain other rules from applying an unnecessary fix.
masthead-remove-background-color (#9774)
We've removed the backgroundColor
prop from Masthead as theming is no longer handled React-side.
In:
import { Masthead } from "@patternfly/react-core";
export const MastheadRemoveBackgroundColorInput = () => <Masthead backgroundColor />
Out:
import { Masthead } from "@patternfly/react-core";
export const MastheadRemoveBackgroundColorInput = () => <Masthead />