What is yarn? How does yarn manage front-end project module dependencies instead of npm?-JS Tutorial-php.cn

This article mainly introduces you to the relevant information about using yarn instead of npm to manage front-end project module dependencies. The article introduces it in detail through sample code. It has certain reference learning value for everyone's study or work. Friends who need it Let’s learn together with the editor below.

This article mainly introduces to you the relevant content about yarn managing front-end project module dependencies instead of npm, and shares it for your reference and study. I won’t say much below, let’s take a look at the detailed introduction.

What is yarn?

# Simply put, yarn is a tool with the same function as npm, used for dependency management of front-end projects. In projects using npm, yran can be used instead wherever the npm command is used.

Why use yarn instead of npm? Compared with npm, the main features of yarn are:

Offline, parallel installation: dependencies are installed in parallel, downloaded dependencies are cached and used first, various optimizations make the installation of dependencies significantly faster To improve
Determinism: The yarn.lock file is generated by default, which can ensure that the directories used by developers to develop and install dependencies are consistent
more …

Well, in fact, npm is also constantly being optimized and improved. But yarn does have many highlights, and at least it is worth using for now.

Yarn Use Quick Start

Installation

Although you can install yarn without relying on npm, It is still recommended that you use npm to install it, fast and concise:

npm i -g yarn

Copy after login

Use

in the project when initializing the project for the first time Execution should also be executed before each project startup/build to ensure that local dependencies are updated in time.

This command will check the dependencies in the package.json and yarn.lock files. When their contents are updated, the dependencies will be updated and installed.

yarn

Copy after login

Dependency update. Execute this command when you want to update dependent modules to their latest versions.

yarn upgrade

Copy after login

yarn Common commands

Start a new project

yarn init

Copy after login

Add dependent package

yarn add [package] yarn add [package]@[version] yarn add [package]@[tag]

Copy after login

Upgrade dependent package

yarn upgrade [package] yarn upgrade [package]@[version] yarn upgrade [package]@[tag]

Copy after login

Remove dependent package

yarn remove [package]

Copy after login

Install all dependencies of the project

yarn

Copy after login

yarn install

Copy after login

Yarn usage practice suggestions

The main reason why we choose yarn is that the dependency installation speed is fast. The default generated yarn.lock will ensure that the module dependency directories of all members can be well consistent. .

The execution logic of yarn install and yarn upgrade allows you to clearly manage the version update timing of local dependencies, and can also keep the local dependencies of all developers consistent.

Using npm install is a bit messy. When you don’t want to hard-code version number dependencies, it will always install the latest available version of the dependent package, but sometimes this is not what you want.

Before yarn, we used the npm+Taobao warehouse solution, and also used cnpm. In China, cnpm's dependency installation speed is faster than yarn, but cnpm manages package dependencies by creating link references under windows, which may cause some problems.

Now we will use Taobao warehouse by default, use npm to manage global dependencies, and use yarn to manage dependencies within specific projects.

To use yarn in a new project, we will do this:

Write package.json and write the initial Three-party dependencies
Execute the yarn command to initialize the installation of project dependencies and generate the yarn.lock file
Add more requirements later by executing yarn add xxx Dependencies (can also be written directly in the package.json file)
When it is determined that the dependent module needs to be updated to its latest version, execute the yarn upgrade command
Before executing the configuration project startup command, execute the yarn command first to ensure that when yarn.lock is updated, local dependencies are also updated in time. For example, configure the start command in the script section of package.json: "start": "yarn && yarn run build:dev"

How do you use yarn? Feel free to share your experiences.

The above is the detailed content of What is yarn? How does yarn manage front-end project module dependencies instead of npm?. For more information, please follow other related articles on the PHP Chinese website!