CODEWITHSUNDEEP
javascriptreactjsecmascript-6
gschambial
gschambial

Reputation: 1391

Unable to export 2 Higher Order Components from one JS file in ReactJS

I have 2 Components in a file and I am trying to supercharge them and export them as HOCs. 

export default withStyles(styles)(Component1);

export withStyles(styles)(Component2);

But, I am getting error on second export. However, if I change it to:

export Component2OtherWay = withStyles(styles)(Component2);

Then, it is working fine. Could anyone explain this to me?

Cheers!

Upvotes: 0

Views: 146

Answers (2)

Sibiraj PR
Sibiraj PR

Reputation: 1481

The default keyword has nothing to do with multiple exports. It's just a name. It’s exported under default name.

So you need another name to export next component.

Upvotes: 1

Shubham Khatri
Shubham Khatri

Reputation: 281656

Since the second export is a named export you need to give it a name which is why you are getting the error.

A file can have only one default export and you need to not give a name to the component exported as default but for a named export you need to give a name which is what the second syntax does 

export const Component2OtherWay  = withStyles(styles)(Component2);

Also a named export can be imported like

import { Component2OtherWay } from 'path/to/Component';

Upvotes: 1

Related Questions