npm package.json 中的版本语义写法及 ~ 和 ^ 的区别

在前端项目中我们经常使用 package.json 中的 dependicies 项目来指定项目的依赖项：

"dependencies": {
    "@material-ui/core": "^4.11.3",
    "@material-ui/icons": "^4.11.2",
    "@testing-library/jest-dom": "^5.11.9",
    "@testing-library/react": "^11.2.5",
    "@testing-library/user-event": "^12.7.3",
    "fontsource-roboto": "^4.0.0",
    "react": "^17.0.1",
    "react-dom": "^17.0.1",
    "react-scripts": "~4.0.3",
    "web-vitals": "^1.1.0",
    "@auth0/auth0-react": "^1.2.0",
    "history": "5.x"
  },

在说明版本时有时候会用到 ~ ，有时候会用到 ^，这就要说到 npm 中的版本管理。npm 的版本管理分为 patch, minor version，还有 major version

版本	说明
patch	补丁。不改变 API 的任何接口，只是小修小改
minor version	次要版本。API 接口有变化，但是还是能保证同版本的兼容性
major version	主要版本。API 接口有变化，可能会因为不兼容导致项目编译失败

• 如果要只接受 patch 版本，我们就需要在版本前加上 ^ 字符或者写为 1.0.x
• 如果只接受 minor version，我们就加上 ~ 字符或者写成 1.x
• 如果可以接受 major version，我们就写成 *

比如上面代码中的 “react-dom”: “^17.0.1”, 就只接受 patch，而 “react-scripts”: “~4.0.3”, 表示接受 minor version，“history”: “5.x” 也是一样的。