JavaScript Default vs. Named Exports: Match the Import to the Export

A does not provide an export named error often means the function exists but the import does not match how it was exported. Default exports and named exports have different contracts despite their similar names.

Import a named export by name, in braces

Import a named export using its exported name in braces. Import a default export without braces. The file path alone is not enough: the import syntax must match the export declaration.

// format.js
export function formatDate(value) {
  return new Intl.DateTimeFormat("en-US").format(value);
}

// app.js
import { formatDate } from "./format.js";

Named exports work well when a module exposes several functions. The import statement shows exactly which function a caller uses. To rename it locally, write an explicit alias such as import { formatDate as format }.

A default export is the module's primary value

// logger.js
export default function log(message) {
  console.log(message);
}

// app.js
import log from "./logger.js";

Do not use braces for a default import. The importing module may choose another local name, but too many names for the same value can make searches and refactoring harder.

Try import { log } from "./logger.js" in a JavaScript module: it asks for a named export that does not exist. Conversely, import formatDate from "./format.js" fails because format.js has no default export. When you see the error, check the braces and export declaration as well as the file path.

Decide what the module is meant to expose

A file centered on one component may naturally use a default export. A utility module with several equally important functions is often clearer with named exports. The useful rule is one your team applies consistently.

Re-exporting many modules through export * can shorten imports, but it can also hide name collisions and dependency paths. Use it deliberately at a package boundary where a public API is needed.

Key takeaways

Use import { name } for a named export and import name for a default export. When an import fails, compare the export declaration with the presence or absence of braces. Decide whether each module exposes one primary value or several peers, then follow that convention consistently.