npm & yarn basics

Introduction

Package manager is a tool responsible for automating processes related to working with packages. Software packages are located in archive files, and each package contains meta-data that describes the given software (such as the software name, version, and list of all dependencies).
The most common application of package manager is when installing packages and their dependencies. Package manager eliminates the need to manually install software. In addition, package manager can handle updating, configuring and finally removing all those components.

The biggest package manager is npm, which is primarily made for the node.js (server) environment, so in order for it to work in a browser, it is necessary to use module bundler (browserify or webpack). Yarn package manager is the “new kid in town”, Facebook’s baby, it can use all npm packages and has a very similar syntax but it is considered to execute commands faster than npm.

Dependency Organization

×

npm uses a nested dependency tree. Nested dependency tree implies that for each package its dependencies are installed, so that the same dependencies (eg Jquery) can be loaded multiple times but for different programs. This type of organization requires more space but allows applications to use different versions of the same software in one project.

It should be noted that the latest version of npm (npm3) tries to prevent “dependencies hell” and its style is more and more like “flat way”. See more about dependencies tree in npm3 on their site.

Example

Installation and initialization

Package manager installation

• npm
• yarn

Update package manager

• npm
• yarn

Initialization of the package manager in the project

Once we have the application installed on our operating system then we can use it in our project. When initializing the package manager, a “package.json” file is generated with the command:

• npm
• yarn

Working with packages

Installing new packages

a) Global installation (operating system)

• npm
• yarn

b) Local installation (inproject)

Package installation is done with the command:

• npm
• yarn

Installing all packages from package.json

When a project is cloned, it does not come with installed packages, but only with instructions on what to install (package.json). Installation of all dependencies defined in the package.json file is done with:

• npm
• yarn

Update dependencies

Individual package updates

• npm
• yarn

Reinstall all packages

• npm
• yarn

Removing dependencies

• npm
• yarn

Starting the package

The corresponding package is started with the command:

• npm
• yarn

Tips & tricks

Using Git repositories instead of npm Modules

If we don’t want to use the official site but some private repository, we can use the following code in package.json:

Deleting undeclared modules

If we ever forget to use --save or --save-dev when installing a package, use the command “prune” to delete such packages:

or in production you need to add –production:

This command deletes all packages that are not in the “package.json” file.

Defining package version

With adequate signs we can more accurately define the package version:

• (^) targets all major versions eg. (1.*.*)
• (~) targets the latest minor version, e.g. (1.2.*)
• Exact version of e.g. (1.2.3)

Fixing package version

If we want to fix the version “forever” during the installation, it is enough to use:

Overview of outdated versions

This command lists the version status for each package at a glance: