Skip to content

Support auto-displayName on more types of react components #4663

@roncohen

Description

@roncohen

I'm opening this to gauge interest and immediate thoughts from you on whether it would be interesting to have https://github.com/opbeat/babel-plugin-add-react-displayname merged into the existing babel plugin babel-plugin-transform-react-display-name.

babel-plugin-add-react-displayname will automatically detect and set displayName for React components that are not using the React.createClass style. This is useful for having real component names show up in production builds of React apps.

This adds support for the two other kinds of component definitions not already covered by the existing displayName plugin:

  • ES6-classes style components
  • Stateless components that return JSX

In our testing, a lot of code is being written with these two styles. This will not cover everything. However, using the existing plugin that alters React.createClass along with this plugin covers a large majority of components we found in the wild.

The tests show more details about what is supported and what is not.

Specifically, see https://github.com/opbeat/babel-plugin-add-react-displayname/blob/master/test/fixtures/passThrough/expected.js for examples that are left untouched by the plugin.

The code is here: https://github.com/opbeat/babel-plugin-add-react-displayname/blob/master/index.js

If you agree this is desirable and think it's viable approach, I'll work on merging them and aligning the tests to the existing style and submit a PR.

Metadata

Metadata

Assignees

No one assigned

    Labels

    area: reactoutdatedA closed issue/PR that is archived due to age. Recommended to make a new issue

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions