Skip to main content Accessibility Feedback

No default exports

Today, I wanted to touch quickly on an extremely opinionated JavaScript architecture/code authoring standards position I have.

Do not ever use default exports.

I’ve worked on projects that used a mix of default exports and collections of exports, and it gets really confusing, really fast.

import { formatCurrency } from './formatCurrency.js';
import convertCentsToDollars from './convertCentsToDollars.js';

Why is formatCurrency destructured, but convertCentsToDollars is not?

You might assume that convertCentsToDollars is the only export in its file, while formatCurrency is one of a few exports.

And that could be the case. Or it could not!

And that’s exactly the point. The mix/match of default exports and object destructuring imports creates needless mental overhead and forces me to think about things that I shouldn’t have to.

If everything gets imported “the normal way,” I never have to think about how to import it.