# Dependency graph and bundling — Webpack

Source: https://www.geekswithgeeks.com/en/webpack/webpack-08

> Learn how Webpack builds the dependency graph.

## Building the dependency graph

Webpack starts from entry points and traverses imports, building a graph of all dependencies. Each file is a node; imports create edges. The graph determines which code to include in the bundle. Unreachable code (dead code) is never included unless forced.

## Visualize dependencies

See how Webpack traces module dependencies to build the bundle.

![Dependency graph showing modules and their connections.](assets/figures/webpack/dependency-graph.svg) — Figure 2.1 — Dependency relationships in your bundle.

## Simple dependency example

Track how Webpack builds the graph from imports.

```javascript
// src/index.js
import { greet } from './utils.js';
greet('World');

// src/utils.js
export function greet(name) {
  console.log(`Hello, ${name}!`);
}
```

Output:

```
Graph: index.js -> utils.js (dependency edge)
```