Difference Between Named and Default Imports: Which One Should You Use?

When you have imports in curly braces, its known as a named import.

import { speak } from "cow";

When you don't have curly braces and just the name, thats a default import.

import Cow from "cow";

The main benefit with a named import is the exporter decides what its being called. The importer can rename it, but they still have to refer to the exported name in doing so.

import { speak as cowSpeak } from "cow";

With the default export, its entirely up to the importer to decide what name to use. The identifier Cow can be anything and there's nothing to tell you what it was intentionally supposed to be.

import Human from "cow";

Because of this, its often recommended to always use named imports and not to use default imports. This adds consistency to your codebase because the same names are being used everywhere. And even if they aren't due to renaming, there's still an explicit reference to the original name in the import statement.