Default export
A default export is the module export designated for import as the module’s default, without requiring a matching exported name.
Get Programming with JavaScript Next: New features of ECMAScript 2015, 2016, and beyond
The single export in a module that is treated as the module's primary exported value and imported without curly-brace name matching.
- How it is used
- Uses a default export to share a module’s main value without making it global.
- How deep it goes
- Explains export expressions, the one-default rule, local import naming, and contrasts with named exports; does not explore module loading internals.
- Examples
- Shows statistics logging, currency formatting, and a class export; assigns a private-number guessing module as practice.
- What you can do after
- Build it from scratch by default-exporting a module’s main function and importing it under a chosen local name.
Secrets of the JavaScript Ninja, Second Edition
The binding or value designated as a module's default export, which can be imported under a chosen local name.
- How it is used
- Represents a module through one designated export, often when it contains a single class.
- How deep it goes
- Explains default-export syntax, arbitrary import naming, and coexistence with named exports through a worked class example.
- Examples
- Uses a Ninja class as the default export and imports it alongside a named function for comparing instances.
- What you can do after
- Apply it via ES6 import syntax to bind the default class locally, instantiate it, and combine it with a named import.
Read how Secrets of the JavaScript Ninja, Second Edition explains default export →
React Hooks in Action: With Suspense and Concurrent Mode
A default export is the single primary value that a JavaScript module can export for import without requiring a matching exported name.
- How it is used
- Designates a module’s primary importable value and supplies the component value required by React.lazy.
- How deep it goes
- Explains declaration, module-object access, destructuring, and lazy-loading requirements without examining module-loader internals.
- Examples
- Uses message utilities, module destructuring, and a calendar component loaded after a Show Calendar button click.
- What you can do after
- Apply it via JavaScript export syntax, dynamic import properties, destructuring, and React.lazy component loading.
Read how React Hooks in Action: With Suspense and Concurrent Mode explains default export →
Related concepts
- import/export syntaxkind of · Module import and export syntax declares dependencies between modules and makes selected bindings available to other modules.
- import statementused by · An import statement is a source-code declaration that makes names or definitions from another module, package, or namespace available in the current scope.
- modulepart of · A module is a distinct, bounded software unit that groups related code or functionality and provides an organizational or interaction boundary within a larger system.
- named exportcontrasts with · A named export is a module binding made available under an explicit name that importing code can reference, with optional renaming.
These guides are generated from the text of Manning books by Manning's knowledge graph and link to the sections they draw on. The full books are available on liveBook and at manning.com.