import/no-default-export

Disallow default exports

Also called import-x/no-default-export

A default export doesn't have a name, so every file that imports it makes one up. The same component ends up as Button here and Btn there, a search for its name misses some of its uses, and renaming it doesn't rename the imports. A named export has one name everywhere.

export { name as default } is reported too.

Configure#

Off by default. To turn it on:

bunfig.toml
[lint.rules]
"import/no-default-export" = "error" # or "warn"

Examples#

example.js1 problem
export default function formatPrice(cents) {
  return `$${(cents / 100).toFixed(2)}`;
}
example.js1 problem
const formatPrice = cents => `$${(cents / 100).toFixed(2)}`;

export { formatPrice as default };
example.jsNo problems
export function formatPrice(cents) {
  return `$${(cents / 100).toFixed(2)}`;
}

When not to use it#

Some tools need a default export, like framework pages and layouts, config files and stories. Turn the rule off for those files.