Import Default Export
There can only be one
This limit on defaults empowers a sugary syntax on the import side.
We can assign the default export to any variable name, without fuss.
In my last post, I demonstrated how I use named exports to expose UI components that are designed to work together.
With this structure,
default becomes a natural place to expose a, default composition of those components for drop-in use.
Now, anywhere I want the default composition, I maximally renamable import.
Because default exports aren’t referenced by the provided name, there’s a tendency to leave off of functions names.
Unfortunately, leaving the name off will impact your developer experience. DevTools will treat these references as anonymous functions.
So, I recommend adding keeping a descriptive name.
I love default exports — when used as intended.
Use named exports and defaults — together — as intended.
This is part of a course I’m build on modules at lunch.dev.
When live, members get access to this and other courses on React.