Problem background
Recently, I found that many front-end frameworks or front-end products use yarn in learning and using it. I didn’t know what it was for at first, but then I searched online and said it was a JS package. For management tools, I always use nodeJs. Is node outdated? Then I did a search and this is how it was introduced on the Internet.
What is Yarn?
“Yarn is a new JS package management tool jointly launched by Facebook, Google, Exponent and Tilde. As written in the official documentation, Yarn appeared to make up for some shortcomings of npm. "This sentence reminds me of the pitfalls when using npm:
npm install is extremely slow. Especially when pulling down a new project, I have to wait for half a day, delete node_modules, and it still remains the same when reinstalling.
The same project cannot be consistent during installation. Due to the characteristics of the version number in the package.json file, the following three version numbers represent different meanings during installation.
"5.0.3",
"~5.0.3",
"^5.0.3"< /span> "5.0.3" means installing the specified 5.0.3 Version, "~5.0.3" means to install the latest version in 5.0.X, "^5.0.3" means to install the latest version in 5.X.X. This is troublesome. It often happens that for the same project, some colleagues are OK, but some colleagues will have bugs due to inconsistent installed versions. 32
1
When is installed, the packages are downloaded and installed at the same time. Sometime in the middle, a package throws an error, but npm continues to download and install the package. Because npm outputs all logs to the terminal, error information about the wrong package will be lost in the pile of warnings npm prints, and you will never even notice the actual error that occurred.
Yarn’s advantages
It is fast. The fast speed mainly comes from the following two aspects:
Parallel installation: Whether npm or Yarn performs a series of tasks when installing a package. npm executes each package according to the queue, which means that it must wait until the current package is installed before continuing the subsequent installation. Yarn executes all tasks synchronously, improving performance.
Offline mode: If a software package has been installed before, it will be obtained from the cache when installing it again with Yarn. There is no need to download it from the network like npm.
Uniform installation version: In order to prevent different versions from being pulled, Yarn has a lock file that records the version number of the exact installed module. Every time a new module is added, Yarn will create (or update) the yarn.lock file. This ensures that every time the same project dependency is pulled, the same module version is used. npm actually has a way to use the same version of packages everywhere, but developers need to execute the npm shrinkwrap command. This command will generate a lock file. When npm install is executed, the lock file will be read first, just like Yarn reads the yarn.lock file. The difference between npm and Yarn is that Yarn generates such a lock file by default, while npm generates the npm-shrinkwrap.json file through the shrinkwrap command. Only when this file exists, the package version information will be recorded and renew.
More concise output: npm's output information is relatively verbose. When executing npm install, all installed dependencies will be continuously printed on the command line. In comparison, Yarn is too concise: by default, it combines emoji to intuitively and directly print out the necessary information, and also provides some commands for developers to query additional installation information.
Multiple registration source processing: All dependent packages, no matter how many times they are indirectly referenced by different libraries, when installing this package, it will only be installed from one registration source, either npm or bower, to prevent confusion and inconsistency.
Better semantics: yarn has changed the names of some npm commands, such as yarn add/remove, which feels clearer than npm's original install/uninstall.
Comparison of Yarn and npm commands
npm yarn
npm install yarn
npm install react - -save yarn add react
npm uninstall react --save yarn remove react
npm install react --save-dev yarn add react --dev
npm update --save yarn upgrade
Installation preparation
General front-end frameworks recommend installing the latest NodeJs when introducing dependent development environments. I checked and found that the latest version is 17.8.0, as shown below:
Install yarn
Execute node command
npm install -g yarn
1
npm ERR! Unexpected token '.'The error is as follows
Problem Solving
Through troubleshooting and trying similar problems introduced online, I found that the version of nodeJs I installed was too high, so I saw the product introduction of the front-end framework saying that the dependent environment is the latest. You must be careful when versioning nodeJs. I uninstalled nodeJs 17.8.0 and used the previously installed 14.18.1 to install yarn again. It was successful, as shown below:
Yarn setting source
In order to further improve the speed of downloading packages, you can set the yarn source to the domestic Taobao image, as follows:
yarn config set registry https://registry.npm.taobao.org -g
yarn config set sass_binary_site http://cdn.npm.taobao.org/dist/node -sass -g
1
2
Verify whether the settings take effect
yarn config get registry
1
npm set source
npm config set registry https://registry. npm.taobao.org
1
Verify whether the settings take effect
npm config get registry
1
The setting process is as follows:
————————————————
版权声明：本文为CSDN博主「CodingPioneer」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/zlbdmm/article/details/123817306