Understanding Dependency Versioning and Updating

This tutorial will focus on everything you need to know within your package.json as regards versioning and how your dependency update works but before we get started, let's take a road map to achieving this.

1. What Is Dependency Version?
2. Major, Minor and Patch.
3. Updating Dependency.
4. The Charet (^) Character & how It works.
5. The Tildle (~) Character & How It Works.

What is Dependency Versioning?

Dependency version represents the three(3) digits separated with a period(.) that is mapped to the actual dependency name. See sample file below:

{
  "name": "night",
  "version": "1.0.0",
  "description": "a simple REST API with express",
  "main": "index.js",
  "scripts": {
    "start": "node server.js",
    "Dev": "nodemon server.js"
  },
  "keywords": [
    "nodejs",
    "express",
    "nodemon"
  ],
  "author": "Ubani Friday",
  "license": "ISC",
  "dependencies": {
    "express": "^4.17.2"
  },
  "devDependencies": {
    "nodemon": "^2.0.15"
  }
}

Look closely at the sample above, you will see two dependencies express and nodemon installed. We would focus on the express library.
"express": ^4.17.2
express signifies the dependency name while ^4.17.2 signifies the version. The three digits signifies Major, Minor and Patch. Let me take you on a ride on what these three digit really means.

MAJOR

This is the first digit from the version number representing a change in the API of the dependency. This means that if there is a change in the API of the dependency, the value of the major version increases.

MINOR

This is the second digit from the version number representing a change in features/functionality of the dependency. This implies that if there is a change in features/functionality of the dependency, the value of the minor version increases.

PATCH

Patch is the last digit of the version number representing any change in bug fixing. This implies that once a bug is detected in a dependency and was fixed, there will be an increase in the value of the patch version.

Updating Dependency

Updating a dependency is the change that occurs in the value of the dependency version and this is triggered by two factors which are:

1. Charet(^) Character
2. Tildle(~) Character

Charet (^) Character

The charet (^) character is used to prefix dependency version in order to bypass code breaking when there is a change in the version of that dependency. It also allows node package manager(npm) to install updates of both MINOR and PATCH versions.
Let's say we install express version of 4.16.0 using npm i express@4.16.0 we would have our dependency looking like the sample below.

{
  "name": "night",
  "version": "1.0.0",
  "description": "a simple REST API with express",
  "main": "index.js",
  "scripts": {
    "start": "node server.js",
    "Dev": "nodemon server.js"
  },
  "keywords": [
    "nodejs",
    "express",
    "nodemon"
  ],
  "author": "Ubani Friday",
  "license": "ISC",
  "dependencies": {
    "express": "^4.16.0"
  },
  "devDependencies": {
    "nodemon": "^2.0.15"
  }
}

If the latest version of express was considered to be used, we then run this command to show the old and latest versions npm outdated see sample image below.

You will notice that the wanted version and updated versions is the same signifying that there was a change in the MINOR and PATCH versions. We can now update the dependency to the latest version by entering the command npm update. At complete installation, the version of express will be changed/updated to the latest version as show below.

{
  "name": "night",
  "version": "1.0.0",
  "description": "a simple REST API with express",
  "main": "index.js",
  "scripts": {
    "start": "node server.js",
    "Dev": "nodemon server.js"
  },
  "keywords": [
    "nodejs",
    "express",
    "nodemon"
  ],
  "author": "Ubani Friday",
  "license": "ISC",
  "dependencies": {
    "express": "^4.17.2"
  },
  "devDependencies": {
    "nodemon": "^2.0.15"
  }
}

Tildle (~) Character

The tildle (~) character is used to prefix dependency version in order to bypass code breaking when there is a change in the version of that dependency. It only accept a change in the PATCH version of the dependency.
Let's understand this better by changing the charet (^) character of the express version installed earlier to tildle (~) character. see sample below.

{
  "name": "night",
  "version": "1.0.0",
  "description": "a simple REST API with express",
  "main": "index.js",
  "scripts": {
    "start": "node server.js",
    "Dev": "nodemon server.js"
  },
  "keywords": [
    "nodejs",
    "express",
    "nodemon"
  ],
  "author": "Ubani Friday",
  "license": "ISC",
  "dependencies": {
    "express": "~4.16.0"
  },
  "devDependencies": {
    "nodemon": "^2.0.15"
  }
}

If we try to check the latest version of the dependency on the terminal of our VSCode by entering the command npm outdated
see sample image below.

we will notice that we the wanted version is different from the latest version unlike the result shown when we ran the outdated command earlier on a charet(^) version of express. Therefore, we can update to the wanted version by entering the command npm i express@4.16.4
see final sample below.

{
  "name": "night",
  "version": "1.0.0",
  "description": "a simple REST API with express",
  "main": "index.js",
  "scripts": {
    "start": "node server.js",
    "Dev": "nodemon server.js"
  },
  "keywords": [
    "nodejs",
    "express",
    "nodemon"
  ],
  "author": "Ubani Friday",
  "license": "ISC",
  "dependencies": {
    "express": "^4.16.4"
  },
  "devDependencies": {
    "nodemon": "^2.0.15"
  }
}

After which you can now change the charet character "express": "^4.16.4" to tildle character "express": "~4.16.4"
If you find this tutorial useful, do well to click like and follow me to get my future articles.
Socialize with me on:
Twitter
LinkedIn

Am also open to being your guest on virtual training on this stack (MERN)
Thanks for your time.