create-react-app - 如何升级create-react-app添加的依赖

Question

我们何时以及如何升级 create-react-app 添加到 package.json 的依赖项？

今天我运行了 npx create-react-app my-app --template typescript 并添加了这些依赖项:

  "dependencies": {
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.3.2",
    "@testing-library/user-event": "^7.1.2",
    "@types/jest": "^24.0.0",
    "@types/node": "^12.0.0",
    "@types/react": "^16.9.0",
    "@types/react-dom": "^16.9.0",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "react-scripts": "3.4.3",
    "typescript": "~3.7.2"
  }

即使有些有可用的更新版本:

• "@testing-library/jest-dom": "^5.11.4"
• "@testing-library/react": "^11.0.4"
• "@testing-library/user-event": "^12.1.6"
• “ typescript ”:“~4.0.3”

我们可以随时升级任何依赖项吗？或者它们是否与 react-scripts 的特定版本相关联？如果是后者，我们如何知道何时升级以及升级到什么版本？

Answer 1

When?

我还在想办法，但也许当依赖项(例如@testing-library/user-event)强烈建议更新时。

and how

这里是如何更新依赖项的演练。你的旅费可能会改变。我建议在移动到下一个之前测试每个更改。一些依赖项可能需要放在一起。

我最近 (2022) 跑了 npx create-react-app my-app --template typescript并使用 npm outdated 分析依赖关系对我来说显示:

Package                      Current  Wanted  Latest
@testing-library/user-event   13.5.0  13.5.0  14.4.3
@types/jest                   28.1.8  28.1.8  29.1.2
@types/node                  18.7.14  18.8.3  18.8.3
web-vitals                     2.1.4   2.1.4   3.0.3

主要版本升级:

你可以看到@testing-library/user-event不“想要”更高版本，但确实存在更高的 MAJOR 版本。为了升级主要版本，这在理论上不会像次要版本那样频繁发生，我使用了涉及 npm uninstall <package-name> 的蛮力方法。然后 npm install <package-name> .

包裹@testing-library/user-event ,

# show the version installed
npm list | grep '@testing-library/user-event'
npm uninstall -D @testing-library/user-event
npm list | grep '@testing-library/user-event'
npm uninstall -D @testing-library/user-event
npm list | grep '@testing-library/user-event'

以上命令打印如下

  ├── @testing-library/user-event@13.5.0

  ├── @testing-library/user-event@14.4.3

正在执行 npm outdated再次显示 @testing-library/user-event被省略。成功!

Package      Current  Wanted  Latest
@types/jest   28.1.8  28.1.8  29.1.2
@types/node  18.7.14  18.8.3  18.8.3
web-vitals     2.1.4   2.1.4   3.0.3

小版本升级:

可以使用 npm update 将包更新到更高的次要版本.

你可以看到@types/node有一个更高的 MINOR 版本 npm outdated标记为 Wanted .您可以通过说 npm update <package-name> 来升级任何想要 MINOR 升级的单个包, 或所有想要通过省略包名称进行小升级的包，例如npm update

只升级包@types/node ,

npm update @types/node
npm outdated

运行上面的命令显示@types/node不再“想要”升级，在以下输出中可见。成功!

Package      Current  Wanted  Latest
@types/jest   28.1.8  28.1.8  29.1.2
web-vitals     2.1.4   2.1.4   3.0.3