Table of Contents
npm version number definition
How to identify dependency versions in package.json
As the title says, this is a bloody lesson. Experience.
devDependencies
peerDependencies
Home Web Front-end JS Tutorial Let's talk about how to use package.json for version management of dependent packages

Let's talk about how to use package.json for version management of dependent packages

Aug 09, 2022 pm 03:08 PM
npm package.json

This article talks about how to use package.json to perform version management on dependent packages in actual front-end projects. What impact will different rules have on dependency management?

Let's talk about how to use package.json for version management of dependent packages

npm version number definition

Version format: X.Y.Z[-string]
The meaning is:

  • X: Major version number
  • Y: Minor version number
  • Z: Correction version number
  • string: Prior version number or version compilation information

For example:

6.3.2-alpha means:

  • Major version number 6 , there are 6 update iterations that are not backward compatible.

  • minor version number 3, there are 3 small function iterations. 6.*.* Any dependency statement of 6.3.2 can install this new package.

  • Correction version number 2, there are 2 bug modifications or other non-major functional modifications. 6.*.* Any dependency statement of 6.3.2 can install this new package.

  • Advanced version numberalpha, indicating the processing trial stage.

Extended reading:Semantic Version 2.0.0

How to identify dependency versions in package.json

will be interpreted as follows:

"vue": "~2.5.22",
"vue-class-component": "^6.0.0",
"vue-router": "3.0.1",
"express": "latest",
"mongoose": "*",
Copy after login
  • Symbol^: Lock the major version, update the minor version number, revised version number and precedence Version number

    For example"vue-class-component": "^6.0.0", when installing dependencies, you can install it in line with 6.*.* Any version, as long as the major version number is 6.

  • Symbols~: Lock the major version number and minor version number, and update the revised version number and advanced version number

    For example "vue": "~2.5.22", when installing dependencies, you can install any version that conforms to 2.5.*.

  • Empty symbol: Lock all version numbers

    For example"vue-router": "3.0. 1", only dependent packages with version 3.0.1 can be installed.

  • Symbol*: Define a certain version number range

    For examplevue-router": "3.0 .*", you can install any version fixed by 3.0, such as 3.0.1, 3.0.2.

  • latest: Install the latest stable version

Lets talk about how to use package.json for version management of dependent packages

  • ## For example,

    "express": "latest", you can install 4.18.1 (the latest version of 2022.06.13).

  • *: Install the latest released version, not necessarily the stable version

Lets talk about how to use package.json for version management of dependent packages

    ##For example
  • "mongoose": "*"

    , you can install 6.0.0-rc2, 3.9.7, etc.

  • Git URL

    : Use packages published on GitQuote format:

    ://[[:]@][:][:][/][# | #semver:]

    ##

    "test": "git+ssh://git@github.com:npm/cli.git#v1.0.27"
    Copy after login
    Extended reading:
  • npm docs - dependencies

Don’t trust the version number of the npm package too much!

As the title says, this is a bloody lesson. Experience.

When the author uses

system.js

, the version limit used is:

system.js: "^6.3.2". When installing dependencies, the version > 6.3.2

was accidentally installed, causing an error in project operation.

The reason is the author of system.js

, The version number was not named according to the

semver specification, which resulted in the author's project introducing not backward compatible updates, which caused the project to run incorrectly.dependencies, devDependencies and peerDependencies

dependencies

The dependencies used in the production environment are uniformly installed under dependencies

.

For example:

"dependencies": {
	"chalk": "^2.4.2",
	"commander": "^3.0.0",
	"fs-extra": "^8.1.0",
	"inquirer": "^6.5.0",
	"mem-fs": "^1.1.3",
	"mem-fs-editor": "^6.0.0",
	"shelljs": "^0.8.3"
}
Copy after login
The above code is a fragment from

package.json

of the

cli toolkit made by the author. shelljs is used to operate files. If it is declared in
devDependencies, an error will be reported after the user installs the current tool package. Because the dependencies declared in the devDependencies field will not be installed when
npm install tool package . It must be declared in the dependencies field to be installed.

devDependencies

生产环境不需要使用的依赖,都需要安装在devDependencies下。
因为生产环境下,是不会安装devDependencies字段下的依赖的。

举个例子:

"devDependencies": {
	"@commitlint/cli": "^8.1.0",
	"@commitlint/config-conventional": "^8.1.0",
	"commitizen": "^4.0.3",
	"commitlint-config-cz": "^0.12.1",
	"cz-customizable": "^6.2.0",
	"standard-version": "^7.0.0"
}
Copy after login

上述代码,是笔者做的cli工具包的package.json中的片段。
commitizen是笔者用于规范Git提交规范的依赖包,只在开发环境中使用,所以在devDependencies中声明。

peerDependencies

当开发一些插件和工具包时,对使用方的运行环境的依赖包版本有要求,可以使用peerDependencies字段进行声明。

举个例子:

{
  "name": "tea-latte",
  "version": "1.3.5",
  "peerDependencies": {
    "tea": "2.x"
  }
}
Copy after login

当前工具tea-latte,依赖tea包。而且,要求tea包是主版本2。

当不满足要求时,控制台会进行报错处理。

注意
npm v7版本, peerDependencies会默认安装。
npm  v3 到 npm v6版本, peerDependencies不会自动安装。

更多node相关知识,请访问:nodejs 教程

The above is the detailed content of Let's talk about how to use package.json for version management of dependent packages. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

JavaScript package managers compared: Npm vs Yarn vs Pnpm JavaScript package managers compared: Npm vs Yarn vs Pnpm Aug 09, 2022 pm 04:22 PM

This article will take you through the three JavaScript package managers (npm, yarn, pnpm), compare these three package managers, and talk about the differences and relationships between npm, yarn, and pnpm. I hope it will be helpful to everyone. Please help, if you have any questions please point them out!

What to do if npm react installation error occurs What to do if npm react installation error occurs Dec 27, 2022 am 11:25 AM

Solution to npm react installation error: 1. Open the "package.json" file in the project and find the dependencies object; 2. Move "react.json" to "devDependencies"; 3. Run "npm audit in the terminal --production" to fix the warning.

Tip sharing: Elegantly obtain the package.json file Tip sharing: Elegantly obtain the package.json file Oct 09, 2022 pm 07:07 PM

In daily development, we all know that package.json is a description of a project or module package, which contains a lot of meta-information. So how should we read package.json to obtain the information inside? What comes into play is our protagonist today - read-pkg. The key source code is only about 30 lines. Next, let's take a closer look at the implementation, which can be regarded as laying the foundation for the subsequent development of our own toolkit!

An article analyzing package.json and package-lock.json An article analyzing package.json and package-lock.json Sep 01, 2022 pm 08:02 PM

This article will give you a detailed explanation of the package.json and package-lock.json files. I hope it will be helpful to you!

What should I do if node cannot use npm command? What should I do if node cannot use npm command? Feb 08, 2023 am 10:09 AM

The reason why node cannot use the npm command is because the environment variables are not configured correctly. The solution is: 1. Open "System Properties"; 2. Find "Environment Variables" -> "System Variables", and then edit the environment variables; 3. Find the location of nodejs folder; 4. Click "OK".

What to do if npm node gyp fails What to do if npm node gyp fails Dec 29, 2022 pm 02:42 PM

npm node gyp fails because "node-gyp.js" does not match the version of "Node.js". The solution is: 1. Clear the node cache through "npm cache clean -f"; 2. Through "npm install -g n" Install the n module; 3. Install the "node v12.21.0" version through the "n v12.21.0" command.

Let's talk about npm configuration of domestic mirrors (Taobao mirrors) Let's talk about npm configuration of domestic mirrors (Taobao mirrors) Aug 09, 2022 pm 12:06 PM

npm is the package management tool for the node.js library. Because the mirror address is abroad, the installation of the library will be slow. You can change the mirror address to a domestic address (Taobao mirror) to improve the speed of installing the library.

This article will help you understand the principles of npm This article will help you understand the principles of npm Aug 09, 2022 am 09:23 AM

npm is the package management tool of the JavaScript world and is the default package management tool for the Node.js platform. Through npm, you can install, share, distribute code, and manage project dependencies. This article will take you through the principles of npm, I hope it will be helpful to you!

See all articles