no-unused-vars rule does not work with React components

[vadimdemedes]

Latest xo has problems with detecting usage of React components over the code (no-unused-vars). Even though components are used in code, xo reports them as defined but never used.

example.js:

const React = require('react');

const Button = React.createClass({});

const Container = React.createClass({
    render: function () {
        return <Button />;
    }
});

package.json:

{
  "scripts": {
    "test": "xo"
  },
  "devDependencies": {
    "xo": "^0.12.1"
  }
}

$ npm test

[sindresorhus]

Yes, ESLint doesn't support React semantics, only parsing JSX. What you want is https://github.com/sindresorhus/eslint-config-xo-react and https://github.com/yannickcr/eslint-plugin-react. I guess I could make that clearer in the readme.

[vadimdemedes]

Thanks! Yeah, that would be great. Because readme states JSX is supported by default, but it kinda isn't.

[sindresorhus]

@vdemedes JSX per its spec is, but React semantics is slightly different from what I can remember.