React schematics exports both "named" and "default" for components?

[iangregsondev]

Hi,

Just started working with the react schematics and I notice that when you create a new UI component it exports both a named export and a default export.

Is there any reason for this?

I was looking at a tutorial by NX but it was never touched upon but I do notice that when consuming the UI components we import them using the "named" export.

I was wondering why?

I much prefer named exports so I was wondering why we are exporting default?

I seemed to remember a while ago I remember reading about an edge case where a named import had a problem with being consumed somewhere in react - but I just can't find it.

Its worth noting that even though the default export is there, it cannot be consumed from app.tsx for example

Would love to hear some feedback why, I mean, its there - so it must be there for a reason :-)

[FrozenPandaz]

We export both so that consumers can pick what suits them best. However, it is true that the default export can't be used when importing it from another library.

@jaysoo We discussed this a while ago and thought that React developers would be more comfortable using the default export. However, the default export not being able to be used when importing it from a library is a little confusing. Any thoughts?

[Hotell]

• I'd add config option to be able to set what kind of export should be used for react component schematic
• while "most" of react ecosystem uses default exports (which is unfortunate for various reasons...), I think having solid standards (named exports) could be great default
• only use case where default exports make sense is a shell feature lib that can be lazy loaded ( as React.lazy works with default only by default )

[montogeek]

Does nx support importing from nested folders?
I am currently using Lerna and my use case is for React.lazy, it only supports default exports, so you can't do:
package-a.js

const LazyLoadedComponent = import("@package-b/core/component")

You have to do:

const LazyLoadedComponent = import("@package-b/dist/core/component")

Which is no that clean and common as when using npm registry packages.

[github-actions]

This issue has been automatically marked as stale because it hasn't had any recent activity. It will be closed in 14 days if no further activity occurs.
If we missed this issue please reply to keep it active.
Thanks for being a part of the Nx community! 🙏

[Hotell]

• I'd add config option to be able to set what kind of export should be used for react component schematic
• while "most" of react ecosystem uses default exports (which is unfortunate for various reasons...), I think having solid standards (named exports) could be great default
• only use case where default exports make sense is a shell feature lib that can be lazy loaded ( as React.lazy works with default only by default )

any thoughts on my proposal ? @jaysoo @FrozenPandaz

[github-actions]

This issue has been automatically marked as stale because it hasn't had any recent activity. It will be closed in 14 days if no further activity occurs.
If we missed this issue please reply to keep it active.
Thanks for being a part of the Nx community! 🙏

[aaronmcadam]

I want to be able to configure my project to generate named exports only. Where did the team get to on this?

[github-actions]

This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context.