The Web Developer Bootcamp 2024

Colt Steele

Back to Node Index Page


 

Package.json
What is package.json

When we create or install node packages, we need a way to essentially, define the package. Things like the author, version number, description, package dependencies and much more. This is where the package.json file comes in. It is required for every package and is always included in the root folder of the package.

Creating a package.json file

When we create a new node package, we create a "parent" folder to hold all of our package files. This is where our package.json file will reside. To demonstrate our principles, we are going to utilize a package called figlet, which creates ASCII art. The package can be found in the Node Registry, .

We're going to start by creating our "parent" folder [figlet]. Now we need to open up our [node] Terminal and navigate to this folder. Once inside the empty [figlet] folder, and from within the [node terminal], we run [npm init].

This will ask us a series of questions designed to help us build a basic package.json file. Now we could create this file entirely on our own, but the init method simplifies the process and ensures that we have some of the most basic info. Just answer the questions as they come up. If any particular question does not apply to your package, just press [enter] and move on. It is not required to answer every question.

Once we finish the process we have a figlet folder with one file, [package.json]. And just for clarity, here is the contents of the file created:

  • json
  • package.json
  • {
    • "name": "figlet",
    • "version": "1.0.0",
    • "description": "A package that generates ASCII Art",
    • "main": "index.js",
    • "scripts": {
      • "test": "echo \"Error: no test specified\" && exit 1"
    • },
    • "keywords": [
      • "figlet"
    • ],
    • "contributors": [
      • {
        • "name": "patorjk"
      • },
      • {
        • "name": "badDoggy"
      • }
    • ],
    • "license": "ISC"
  • }

(*note: We can just use [npm init -y] if we want to fill out the info in the package.json file later. The -y flag skips all of the questions, and makes your package.json file with empty values.)

Now that we have our basic package.json file, now we need to install our [figlet] package. We should already be in our figlet directory we created, but if not, just navigate to it in the terminal. Then type [npm i figlet], as shown in the package documentation.

After the figlet install, if we look at our package.json file we notice that it has add the following "dependencies" to our project:

  • "dependencies": {
    • "figlet": "^1.8.0"
  • }
meaning that our project now requires figlet v1.8.0 or greater.

We should now be able to write the code to run our figlet project. Remember that an [index.js] file is required in the root project folder, so we're going to create that now. In this file we will require the figlet package we installed, and set a variable for the text we want to use for the art:

  • JavaScript
  • index.js
  • // import the figlet package
  • const figlet = require('figlet');
  • // Set the text for the art
  • const artText = 'Hello World!!';

And now we can add some code to our [index.js] file, so we can console.log some ASCII Art. We'll just copy the example from the figlet website.

  • JavaScript
  • index.js
  • figlet( artText, function ( err, data ) {
    • if (err) {
      • console.log("Something went wrong...");
      • console.dir(err);
      • return;
    • }
    • console.log(data);
  • });

and if we run [index.js] the console should log:

  •                       _   _      _ _        __        __         _     _ _ _
                         | | | | ___| | | ___   \ \      / /__  _ __| | __| | | |
                         | |_| |/ _ \ | |/ _ \   \ \ /\ / / _ \| '__| |/ _` | | |
                         |  _  |  __/ | | (_) |   \ V  V / (_) | |  | | (_| |_|_|
                         |_| |_|\___|_|_|\___/     \_/\_/ \___/|_|  |_|\__,_(_|_)
                      

Dependencies

One of the most important aspects of the package.json file are the dependencies. Once you have created your package.json file, and then install your packages, the package.json file updates it's dependencies. So you have a record showing what version of the packages were installed in your project. This could be very useful information if something happens to one of you project packages and it becomes unusable, you would know which version need to be reinstalled.

Another reason why the dependency list in the package,json file is so important is because some packages DO NOT include ALL of the dependant packages when installed. We can look at the package node-group-chat as an example. This package does not come from the npm registry, it comes from the author's GitHub page. So to install this package, you would download the .zip file and extract the files into your project folder.

Now if we take a look at these files, we notice two things. First we see that there is not a [node_modules] folder. This is where the dependant files would be located. And second, if we look in the [package.json] file, we see the there are three dependencies that need to be installed:

  • ejs
  • express
  • socket.io

Now this package only needs the three dependent packages installed, so we could just find them in the npm registry and install them individually. But what if we were dealing with a package that had say, 50 or 100 missing dependent packages? Now installing each dependent package individually becomes problematic at best. But there is a better way.

What we need to do is navigate, in the Terminal, to the parent directory of the project. The one that has the [package.json] file. Once there, we can run [npm install]. This will search our [package.json] file, create our [node_modules] folder to contain any missing dependant packages and then download and install, any missing dependencies that are required. Much, much easier than downloading and installing each dependent package individually.

The biggest takeaway here is that if your [node_modules] folder is missing or corrupt, or if you are missing any dependent packages, that your [package.json] file says you should have, then you can run [npm install] to restore all missing dependant packages and the [node_modules] folder itself.


Back to Top