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!
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';
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.
