Version Ranges: Caret (^) vs Tilde (~)

When you run npm install react, npm doesn't lock your package.json to the exact version it downloaded (e.g., 18.2.0). Instead, it adds a **version range** (e.g., ^18.2.0).

A version range tells npm how aggressive it should be about automatically upgrading your dependencies when new versions are published to the registry.

The two most common range specifiers are the Caret (^) and the Tilde (~).

If every package was locked to an exact version (e.g., 18.2.0), you would never receive automatic bug fixes or security patches.

However, if ranges were too loose (e.g., *), a breaking API update could slip into your project and crash your build.

The Caret and Tilde strike a balance, leveraging the rules of SemVer to allow safe updates while blocking dangerous ones.

The **Caret (^)** allows updates that do not modify the leftmost non-zero digit. For ^1.2.3, this allows MINOR and PATCH updates (up to, but not including, 2.0.0). This is npm's default because it safely delivers new features and bug fixes.

The **Tilde (~)** is more conservative. If a minor version is specified, it allows ONLY PATCH updates. For ~1.2.3, it will accept 1.2.4 and 1.2.99, but will block 1.3.0.

Exact versions (e.g., 1.2.3 with no prefix) lock the dependency entirely. No updates will occur unless explicitly requested.