The dependencies of a piece of code determine its effectiveness in executing the tasks or solving the problem it is meant for. As such, a proper understanding of the relationships between code blocks and their dependencies is necessary for every developer.

This article will not only introduce you to the concept of dependency in software development but also cover the various types of dependencies available, their roles, and how to import them into a project. Rare dependencies such as optionalDependencies and bundleDependencies will, however, not make it to this article.

Contents

• What are dependencies

• Types of dependencies

• Production dependencies

• How to install production dependencies

• devDependencies

• How to install devDependencies

• Peer dependencies

• How to install peer dependencies

• Moving packages between dependencies

• Common questions about dependencies

• Conclusion

What are dependencies?

A dependency is a resource, package, or file upon which a piece of software relies. Imagine a scenario where a program, named A, is made up of two subprograms: B and C. These subprograms, in turn, contain variables, functions, or image files. If you execute program A when it cannot access the contents of its subprograms, you will get an error message. In this case, both B and C are the "dependencies" of the parent program, A.

Types of dependencies

The following are the two broad categories of dependencies:

• Direct dependencies

  As the name implies, direct dependencies are the packages with which your code maintains a first-hand relationship. Functionalities from such packages can be found directly in your code base, not in a third-party package. Production and development dependencies are good examples of direct dependencies.

• Transitive (or indirect) dependencies

  A dependency can have its own set of dependencies. Importing such a dependency into your code block results in a nesting of dependencies, which creates an indirect relationship between your code and the dependency's dependencies. A peer dependency is a good example of a transitive dependency.

The upcoming section will discuss the subcategories of dependencies used as examples above, their roles, and how to import them into a project.

Production dependencies

Production dependencies are the packages upon which your app relies to run outside of the development environment. Bootstrap and React are popular examples of production dependencies.

As seen in the image below, production dependencies are often referred to as just "dependencies" in code bases. Both terms refer to the same idea and can be used interchangeably.

How to install a production dependency

To install a production dependency, run the command npm install <package-name> --save-prod from your terminal. The --save-prod flag is optional. By default, npm attaches a --save-prod flag when you run this command. Therefore, you can omit the flag and rewrite the previous command as npm install <package-name>

You can also install a production dependency manually. To do that, open your package.json file in a code editor, and add an object named dependencies. This new object should contain a dependency and its version number in a key-value pair, as seen below:

"dependencies": {
    "dependency_name": "version_number"
  }

DevDependencies

Dev (or development) dependencies are the packages only needed for local development and testing; these packages do not serve any purpose beyond the development phase. Test tools (Jest, Enzyme, etc.) and code linters (ESLint, Standard JS, etc.) are good examples of development dependencies. In a package.json file, development dependencies can be found under a devDependencies object. See the image below for reference:

How to install a devDependency

To add a package as a devDependency run the following command: npm install <package-name> --save-dev. Unlike regular dependencies, you must attach the --save-dev flag.

You can also install a devDependency manually. To do that, add an object named devDependencies to your package.json file. Within this new object, list your packages and their version numbers in a key-value pair, as seen below:

"devDependencies": {
    "enzyme": "^3.11.0"
    "your_devDependency": "version_number"
  }

Peer dependencies

Peer dependencies allow developers to state the host environment their package is compatible with. For example, imagine publishing a React package to the npm registry, and in the package.json file, you listed React version 2.0 (or higher) as a peer dependency. The implication is that anyone installing your package from the registry also requires React version 2.0 (or higher). The following snippet shows React listed as a peer dependency:

"peerDependencies": {
    "react": "^2.0.0"
  }

Unlike production dependencies and devDependencies, npm does not install packages listed as peer dependencies automatically. NPM only issues a warning when it cannot find a listed peer dependency, or when it encounters the wrong version.

How to install a peer dependency

From npm version 7 and above, running the npm i <package-name> command automatically installs the peer dependencies for a package. You can confirm your version of npm by running the npm -v command.

Moving packages between dependencies

To move a package from being a devDependency to a production dependency, run the command npm i <package name> --save-prod from your terminal. Conversely, if you need to move a package in the opposite direction, run the command npm i <package name> --save-dev.

Common questions about dependencies

This section provides answers to some of the most common questions about dependencies.

• What is the difference between devDependencies and production dependencies?

  devDependencies are the packages your app needs during development and testing. On the other hand, your app relies on production dependencies to run outside the development environment.

• Do devDependencies go into production?

  Since devDependencies serve development purposes only, they do not go into production. If your project needs a package beyond development, you're better off having such a package as a regular dependency.

• Is Bootstrap a devDependency?

  Can Bootstrap be a devDependency? Yes. Is it ideal to have Bootstrap as a devDependency? Probably not. Since your app needs Bootstrap to run in production, you should install Bootstrap as a regular dependency.

• Can React be a devDependency?

  Having React as a devDependency does not stop your app from compiling. This is because Webpack, which React uses for bundling, follows the import statements in your code regardless of React's position in the package.json file.

• How do you create a dev dependency?

  You can create a dev dependency through the command line or by manually editing your package.json file. Both methods have been described earlier in this article.

• What is the difference between dependency and peer dependency?

  A dependency is the regular package an app needs to run in production. A peer dependency, on the other hand, specifies the versions of a host environment a piece of software is compatible with.

Final words

In this article, you looked at the concept of dependencies, its various forms, and the role each form plays in your application. You also went through the answers to some of the common questions about dependencies. While there are other types of dependencies outside what you saw here, you already have a good understanding of the most important ones.

Generally, endeavour to follow the convention by having dependencies needed for development as devDependencies and those for production as regular dependencies. If you're publishing a package to the npm registry, list your peer dependencies in the peer dependencies object of your package.json file.