missing "class-memebers" in "order" for typescript-eslint-parser

[dudiharush]

When I use a tsx file (typescript) with typescript-eslint-parser, and I write a class member, it always errors me for placing it before lifecycle methods. ex:

class MyComp extends React.Component<any, any> {
private _someMember; // error: should be placed before componentWillMount eslint(react/sort-comp)

componentWillMount() {
this._someMemeber = 1;
}
render...
}

Can you please add "class-members" to the "order" category, or support "everything-else" in multiple places?

Thanks!

[ljharb]

If you mean the sort-comp rule, you can configure it with “instance-variables” per the docs.

[dudiharush]

I tried it, but it didn't work.
Can you send me the values in "order"?
Maybe i'm missing something...

[ljharb]

It’s possible it doesn’t work with typescript, of course. What is your exact config?

[dudiharush]

 "rules": {
                "react/sort-comp": [2, {
                      "order": [
                        "static-methods",
                        "instance-variables",
                        "lifecycle",
                        "everything-else",
                        "render"
                      ],
                      "groups": {
                        "lifecycle": [
                          "displayName",
                          "propTypes",
                          "contextTypes",
                          "childContextTypes",
                          "mixins",
                          "statics",
                          "defaultProps",
                          "constructor",
                          "getDefaultProps",
                          "state",
                          "getInitialState",
                          "getChildContext",
                          "getDerivedStateFromProps",
                          "componentWillMount",
                          "UNSAFE_componentWillMount",
                          "componentDidMount",
                          "componentWillReceiveProps",
                          "UNSAFE_componentWillReceiveProps",
                          "shouldComponentUpdate",
                          "componentWillUpdate",
                          "UNSAFE_componentWillUpdate",
                          "getSnapshotBeforeUpdate",
                          "componentDidUpdate",
                          "componentDidCatch",
                          "componentWillUnmount"
                        ]
                      }
                    }]
            }

I think there is already an open issue about this problem: #1664

[ljharb]

That issue is closed.

I think this is typescript specific - JS doesn’t use the private keyword. Separately, instance variables refers to public properties.

I’m not sure we support JS private fields, let alone TS ones.

[ljharb]

We now support JS private fields and methods. If there's any issue with TS's private declaration, please file a new issue.