Packages and Import Statements

Estimated study time: 6 minutes. How code gets organized, shared, and reused across a real project.

As a project grows, keeping every line of code in a single file becomes unmanageable. Packages (or modules, depending on the language) let you split code into logical, reusable units — and import statements are how you pull that code into another file when you need it.

What Is a Package?

A package is a directory or file grouping related functionality — for example, a utils package might hold helper functions for formatting, validation, and logging, all kept separate from your main application logic.

Import Statement Basics

// Importing a whole module
import * as utils from './utils';

// Importing specific exports
import { formatDate, validateEmail } from './utils';

// Importing a default export
import Logger from './logger';

Why This Matters

  • Reusability — write a function once, use it anywhere it's imported.
  • Maintainability — smaller, focused files are easier to read and debug.
  • Namespace control — imports prevent naming collisions between unrelated parts of a codebase.
  • Tree-shaking — modern bundlers can drop unused imports, keeping production builds smaller.

Named vs Default Exports

A named export lets a file export multiple values by name, imported using curly braces. A default export exposes one primary value per file, imported without braces. Most real-world projects use a mix of both depending on whether a file has one clear "main" export or several related utilities.

💡 Tip: Keep imports at the top of the file and grouped logically (external libraries first, then internal modules) — it makes dependencies easy to scan at a glance.

Ready to go beyond the basics?

Get hands-on training, live mentorship, and placement support with Uncodemy's Angular Training Course.

Explore Angular Training Course →