This content originally appeared on DEV Community and was authored by Sohil Lalakiya
🎯 Understanding ^ (Caret) and ~ (Tilde) in package.json
While working with a Node.js or React project, you may have seen ^ (caret) and ~ (tilde) symbols in your package.json file under the dependencies section. These symbols define how the version of dependencies is handled when updating packages.
📌 Let’s understand the version structure first.
For example, if you specify:
"express": "~4.17.1"
It means dependency follow this version structure:
- 🔴 Major version (4): Introduces breaking changes.
- 🟠 Minor version (17): Adds new features and solves compatibility issues.
- 🟢 Patch version (1): Includes bug fixes and security updates.
❓ What are the Caret (^) and Tilde (~) symbols ?
🚀 Caret sign (^):
The caret symbol will allow you to update the latest minor version without updating the major version.
For example, if you specify:
"react": "^19.0.2"
Now your version can update to any newer version up to 19.X.X but it will not update to 20.0.0 or higher.
- ✅ For example valid updates can be: 19.8.7 or 19.9.0 and so on.
- ❌ Invalid updates can be : 20.0.1 or 21.0.9 and so on.
📌 This is the default behavior of packages when you install packages using npm install package_name.
🎯 Tilde (~):
The tilde symbol will allow you to update the latest patch version without updating the minor version.
For example, if you specify:
"react": "~19.0.2"
Now your version can update to any newer version up to 19.0.X but it will not update to 19.1.0 or higher.
-✅ For example valid updates can be: 19.0.7 or 19.0.3 and so on.
-❌ Invalid updates can be : 19.1.1 or 19.2.9 and so on.
🤔 Which one is good for you ?
- ✅ Caret (^) : use caret if you want to allow minor updates that introduce new features while maintaining backward compatibility.
- 🛠️ Tilde (~) : use tilde if you want to allow just patch updates that introduce security and bug fixes.
- 🔒Locking the exact version: you can also go with "react": "19.0.0" (without use of tilde or caret) and it will lock the version updates so in future you can’t get any updates of your package.
Happy Learning 🚀😊!!!
This content originally appeared on DEV Community and was authored by Sohil Lalakiya
Sohil Lalakiya | Sciencx (2025-03-04T03:35:29+00:00) Understanding The Difference Between Caret(^) and Tilde(~) In Your React or Node Project. Retrieved from https://www.scien.cx/2025/03/04/understanding-the-difference-between-caret-and-tilde-in-your-react-or-node-project/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.