An eslint plugin (with an extra CLI utility) to help ease products transitioning to our new major @patternfly/react-core 4.0.0 release.
- We want to minimize code changes and respect existing code
- We only want to make safe modifications
- Don't touch code that might not be PatternFly
- Most consumers are using JSX, so we can write rules that target JSXElements
- When they're using React.createElement or React.cloneElement that introduces unsafe complications
- Use a JSX parser that leaves formatting alone as much as possible
- Add basic ESM import parsing to make sure we're only modifying PatternFly
<Button>
s
This is what @redallen does to develop a rule:
Copy a similar rule fromeslint-plugin-pf-codemods/lib/rules/*
Add it to therules
object at the top ofeslint-plugin-pf-codemods/index.js
Copy a test attest/rules/*
and write your test cases.
We now have a generator.
- Run
node generate new-rule-name
to create the rule files - Run
node test/rules/new-rule-name.js
to test the rule
If you're having trouble writing a rule, you can:
- Put code into an AST explorer like https://astexplorer.net/ to inspect all the AST nodes
console.dir(node, { depth: 5 })
to better inspect anode
you're dealing with- Write rule targeting an AST node that has all the information you need. Confirm AST node exists in
lib/rules/ast-node-types.d.ts
. - Ask zallen on the RHUX or PatternFly Slack