Skip to content

require-optimization should ignore components not extending React.Component #986

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
rake5k opened this issue Dec 1, 2016 · 4 comments
Closed

Comments

@rake5k
Copy link

rake5k commented Dec 1, 2016

We use a base class to extend our Components, so we do not have to optimize each Component on its own:

import React from 'react';
import shouldPureComponentUpdate from 'react-pure-render/function';

// Optimized base class:
export default class Component extends React.Component {

    shouldComponentUpdate(...args) {
        return Reflect.apply(shouldPureComponentUpdate, this, args);
    }

}

However, require-optimization is complaining that the Components extending this base class were not optimized.

@ljharb
Copy link
Member

ljharb commented Dec 1, 2016

Using a base class is a bad practice (article by the React team: https://facebook.github.io/react/docs/composition-vs-inheritance.html) - however, this plugin supports a JSDoc-style annotation you can add in a comment above all of your components to indicate they are react components.

What I'd recommend instead is importing shouldPureComponentUpdate in every single component rather than using inheritance to solve that problem (or using a decorator).

@jpickwell
Copy link

@christianharke, the plugin doesn't look for React.Component or React.PureComponent, it looks for Component and PureComponent. Notice the lack of the React. prefix. You could rename your base Component class to BaseComponent or anything that isn't Component or PureComponent and this would stop the plugin from treating the class like a React component.

@jpickwell
Copy link

Looking at the source, the React. prefix (React being the pragma) is treated as optional. So,
it looks for all of the following:

  • Component
  • React.Component
  • PureComponent
  • React.PureComponent

(assuming pragma is set to the default of React)

@rake5k
Copy link
Author

rake5k commented Feb 28, 2017

Thank you @jpickwell!

Just renaming the variable from Compontent to BaseComponent while importing fixed the issue.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

No branches or pull requests

3 participants