Named exports with redux?

Question

i have got used to using named exports as it makes life easier for refactoring. I have just started to implement redux but it seems i can't do a named export because the connect needs to map the component.

so for example

class Something extends Component { ... }

export default connect(mapStateToProps)(Something);

Would it be possible to use a named export like "Something", i can't place the export on the class as although react continues to work - the connect is not getting exported so there is no redux state

Any ideas ?

Thanks in advance

Answer 1

Just assign it to a const and export that like so:

class Something extends Component { ... }

export const ConnectedSomething = connect(mapStateToProps)(Something);

Then you can import it like so:

import { ConnectedSomething } from './....'

Answer 2

If I'm understanding correctly, then you could export your "redux connected" component via named export as follows:

/*
Declare component class, with class name differing from named export
*/
class SomethingComponent extends Component { ... };

/*
Export redux connected HOC to external modules, via named export "Something"
*/
export const Something = connect(mapStateToProps)(SomethingComponent);