Shulou(Shulou.com)06/01 Report--

Today, Xiaobian will share with you what are the relevant knowledge points of Yarn and npm commands. The content is detailed and the logic is clear. I believe most people still know too much about this knowledge, so share this article for your reference. I hope you will gain something after reading this article. Let's find out together.

Layout Basics

Previously, a simple text editor was enough for developers to create and manage most of their projects. But as technology evolves, the Web has changed dramatically. Today, it is common for even a fairly simple project to have hundreds or thousands of scripts, with complex nested dependencies. These scripts simply cannot be managed without some automation tool. This is where the package manager comes into play.

A package manager is a tool that automatically handles project dependencies in a variety of different ways. For example, with the help of the package manager, we can install, uninstall, update and upgrade packages, configure project settings, run scripts, etc. All the hard and tedious work is done by the package manager, leaving only the fun part-the coding itself.

Npm stands for Node Package Manager. It was released in 2010 and ushered in a new era of Web development. Prior to this, project dependencies were downloaded and managed manually. Npm is the magic wand that pushes the Web to new heights.

NPM actually involves three things:

A website for managing all aspects of the npm experience

A registry to access an extensive public database of JavaScript packages

Command line interface (CLI) for interacting with npm via terminal

However, when most people talk about npm, they usually mean the last one-CLI tools. It is provided as the default package manager with each new Node installation. This means you can start using it immediately.

If you want to learn more about how to use NPM, please see our NPM tutorial.

Yarn stands for another resource manager. Yarn Package Manager is an alternative to npm, released by Facebook in October 2016. Yarn's initial goal was to address the shortcomings of npm, such as performance and security issues. Yarn was quickly positioned as a safe, fast, and reliable JavaScript dependency management tool.

But the NPM team learned its lesson and quickly filled in the gaps in NPM by implementing missing features.

Let's take a quick look at the big picture:

2010: npm released with support for Node.js.

2016: Release of yarn. It shows higher performance than npm. It also generates a yarn.lock file that makes sharing and exact replication of repos easier and more predictable.

2017: NPM 5 released. It provides automatic generation of package-lock.json files in response to yarn.lock.

2018: NPM 6 released, improved security. Npm now checks for security vulnerabilities before installing dependencies.

2020: Yarn 2 and NPM 7 are released. Both packages come with great new features, which we'll see later in this tutorial.

2021: Yarn 3 is released with various improvements.

Today, the two package managers are neck and neck in the package management race, offering similar features and functionality. But there are still some differences that help determine which one we choose to use.

In the rest of this tutorial, we will explore the main similarities and differences between npm and Yarn.

Yarn vs. npm: installation comparison

We'll start our comparative exploration with the installation process of npm and Yarn.

Install the package manager itself

As I mentioned above, npm comes preloaded with Node, so there is no need to install npm manually.

Yarn, by contrast, requires explicit installation. First, we need to install Yarn globally:

npm install -g yarn

We can then use it on a per-project basis by setting the desired version in our project. We do this by running the command yarn set version in the root directory of the project:

yarn set version berry

In this case berry is the version we want to set.

If we want to update to the latest version, we run:

yarn set version latest

With Yarn, we can use different versions for each project.

To do the same with npm, you need to install nvm (Node Version Manager). Here's how to install multiple versions of Node using nvm.

Installation project dependencies

Now, let's see how to install project dependencies.

When we run npm install, dependencies are installed one by one. The output log in the terminal is informative but a bit hard to read.

To install packages using Yarn, we run the Yarn command. Yarn parallel install package, which is one of the reasons it is faster than npm. If you are using Yarn 1 version, you will see that Yarn output logs are clean, visually distinguishable, and short. For ease of understanding, they are also arranged in the form of trees. But this changed in versions 2 and 3, where the logs were less intuitive and human-readable.

So far we have seen that npm and Yarn have different installation package commands. In the next section, we will explore more commands.

Compare npm and Yarn commands

Npm and Yarn share many commands, but there are also many different commands. Let's explore some of the same commands first:

npm init| yarn init: Create a new package

npm run| yarn run: Run defined in package.json

npm test| yarn test: Test a package

npm publish| yarn publish: publish package

npm cache clean| yarn cache clean: Remove all data from cache folder

These commands make it easy to switch between the two managers, but there are a few different commands that can cause confusion. Let's see what they are in the next list:

npm install| yarn: install dependencies

npm install [package]| yarn add [package]: Install a package

npm install --save-dev [package]| yarn add - -dev [package]: Installs a package as a development dependency

npm uninstall [package]| yarn remove [package]: uninstall a package

npm uninstall --save-dev [package]| yarn remove [package]: uninstall development dependencies

npm update| yarn upgrade: update dependencies

npm update [package]| yarn upgrade [package]: Update a package

Yarn also has some unique commands that have no npm equivalent. For example, the why command shows why a package is needed: it could be a dependency, native module, or project dependency.

Yarn vs. npm: speed and performance

Whenever Yarn or npm needs to install a package, they perform a series of tasks. In npm, these tasks are performed in package order, which means it waits for one package to be fully installed before moving on to the next. In contrast, Yarn performs these tasks in parallel, resulting in improved performance.

While both managers provide caching mechanisms, Yarn seems to do a better job. By implementing the zero-install paradigm, which we will see in the feature comparison section, it is possible to install packages almost immediately. It caches each package and saves it on disk, so on the next installation of this package, you don't even need an internet connection because the package was installed offline from disk.

Although Yarn has some advantages, Yarn and npm are on par in their latest versions. So we can't define a clean winner here.

Yarn vs. npm: safety comparison

One of the main criticisms of npm concerns security. Previous versions of npm had several serious security vulnerabilities.

Starting with version 6, npm reviews packages during installation and tells you if any vulnerabilities have been found. We can perform this check manually by running npm audit against installed packages. If any vulnerabilities are found, npm will give us security advice.

As you can see in the screenshot above, we can run npm audit fix to fix the package vulnerability, and if possible, the dependency tree will be fixed.

Yarn and npm both use cryptographic hashing algorithms to ensure packet integrity.

Yarn vs. npm: a functional comparison

Just like commands, some features are shared by npm and Yarn, but there are also some differences. Let's first explore the common features shared by the two package managers.

Generate lock file

Version numbers are not always accurate in package.json npm and Yarn files that track project dependencies. Instead, you can define a series of versions. This way, you can choose specific major and minor versions of the package, but allow npm to install the latest patches that might fix certain bugs.

In an ideal world of semantic versioning, patch versions would not contain any disruptive changes. Unfortunately, this is not always the case. The strategy adopted by npm may result in two machines ending up with the same package.json file, but with different versions of the package installed--which may introduce errors.

To avoid package version mismatches, the exact installed version is fixed in the package lock file. Each time a module is added, npm and Yarn create (or update) a package-lock.json and yarn.lock file, respectively. This way, you can guarantee that another machine installs exactly the same package while still having package.json.

use the workspace

Workspaces allow you to have a single monorepo to manage dependencies across multiple projects. This means that you have a single top-level root package that contains multiple child packages called workspaces.

Run scripts remotely

The npx command is used from./ node_modules/.bin. It also allows you to execute packages from the npm registry without installing them in your project dependencies. For example, you can create a new React application by running:

npx create-react-app my-app

In Yarn, you can use the equivalent dlx command to get the same result:

yarn dlx create-react-app my-app

The rest of the features we'll explore are unique to Yarn.

zero-install

Zero install stores the cache in a.Yarn folder in your project directory. When you use commands such as yarn or yarn add, Yarn creates a.pnp.cjs file. This file contains the dependency hierarchy Node uses to load project packages. So you can access them almost at zero time.

plug and play

Plug'n'Play is another installation strategy. Instead of generating directories and leaving parsing to Node, node_modulesYarn generates a.pnp.cjs file that maps packages to their location on disk and their dependency list. This feature can lead to faster project startup, better optimization of dependency trees, faster installation times, and of course no need for the node_modules folder.

license

Yarn includes a built-in license checker that can be used in different scenarios as you develop your application.

Yarn vs npm: Choose which package manager

We've covered various similarities and differences between npm and Yarn, but we haven't decided which is better and which we should choose. As always, the answer depends on our wishes and demands.

As a general guide, let me summarize the following recommendations:

If you are happy with your current workflow, don't want to install additional tools, and you don't have a lot of disk space, choose npm.

If you want something great like Plug'n'Play, you need something missing from npm, and you have plenty of disk space, choose Yarn.

If you're still struggling to make a clear decision between npm and Yarn, then you can check out pnpm, which attempts to combine the strengths of both package managers and is the third big fish in the package management pool.

The above is "Yarn and npm commands what" all the content of this article, thank you for reading! I believe everyone has a great harvest after reading this article. Xiaobian will update different knowledge for everyone every day. If you want to learn more knowledge, please pay attention to the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.