【问题标题】:Upgrading React version and it's dependencies by reading package.json通过阅读 package.json 升级 React 版本及其依赖项
【发布时间】:2018-09-24 11:48:42
【问题描述】:

我有一个现有的项目,它有 react@15 和所有它的依赖项。但现在我必须升级到 react@16 以及它的依赖项。现在,问题是 - 有很多依赖项,识别每个依赖项的版本非常耗时。

所以,我想知道是否有一种方法可以升级 React 的版本以及 package.json 中提到的依赖项,而无需手动修改 package.json 文件。

【问题讨论】:

  • 你可能只需要运行yarn upgrade,它将把你所有的包升级到最新版本
  • yarn upgrade 不会更新主要版本。它将从 15 升级到 15.6,但不会升级到 16.0,因为你应该使用 yarn upgrade --latest

标签: reactjs dependencies upgrade


【解决方案1】:

使用 npm

最新版本同时仍然尊重 package.json 中的 semvernpm update <package-name>。 因此,如果您的 package.json 显示 "react": "^15.0.0" 并且您运行 npm update react 您的 package.json 现在将显示 "react": "^15.6.2"(当前最新版本的 react 15)。

但既然你想从反应 15 到反应 16,那是行不通的。 最新版本,无论您的 semver 是什么:npm install --save react@latest

如果您想要特定版本,请运行npm install --save react@<version>,例如npm install --save react@16.0.0.

https://docs.npmjs.com/cli/install

使用纱线

最新版本同时仍然尊重您 package.json 中的 semveryarn upgrade react

无论您的 semver 的最新版本:yarn upgrade react@latest

https://yarnpkg.com/lang/en/docs/cli/upgrade/

【讨论】:

  • 谢谢你完美运行,npm install react@latest react-dom@latest next@latest
【解决方案2】:

如果你想在现有的 react 步骤中更新你的 react 和 react-dom 版本,那么运行这个命令我希望你得到最新版本的 react 和 react-dom。

谢谢

npm install react@latest react-dom@latest

【讨论】:

  • +1。仅更新两者之一 - ract-domract - 可能会导致依赖冲突 (example)。
【解决方案3】:

是的,您可以使用 Yarn 或 NPM 来编辑您的 package.json。

yarn upgrade [package | package@tag | package@version | @scope/]... [--ignore-engines] [--pattern]

类似:

yarn upgrade react@^16.0.0

然后我会看到什么警告或错误,然后运行yarn upgrade [package]。无需手动编辑文件。可以通过 CLI 执行所有操作。

或者只是运行yarn upgrade 将所有包更新到最新版本,这对于大型项目来说可能是个坏主意。 API 可能会发生变化,事情可能会中断。

或者,使用 NPM 运行 npm outdated 以查看哪些包会受到影响。那么

npm update

https://yarnpkg.com/lang/en/docs/cli/upgrade/

https://docs.npmjs.com/getting-started/updating-local-packages

【讨论】:

    【解决方案4】:

    我强烈建议使用yarn upgrade-interactive 来更新 React 或任何 Node 项目。它列出了您的软件包、当前版本、最新版本、与您所拥有的相比的次要、主要或补丁更新的指示,以及指向相应项目的链接。

    您可以使用yarn upgrade-interactive --latest 运行它,如果需要,请查看发行说明,使用箭头键进入列表,使用空格键选择要升级的软件包,然后点击Enter 完成。

    Npm-upgrade 可以,但没那么流畅。

    【讨论】:

    • 这个选项超级有趣,不知道..谢谢!
    【解决方案5】:

    我找到了一个不错的article here

    我们需要做的(对于 npm,全局)是:

    sudo npm install -g npm-check-updates
    

    然后像下面这样运行它:

    ncu -u
    

    它将向您显示所有依赖项(已升级),如下所示:

    Upgrading /home/ajay/Documents/react-beast/package.json
    [====================] 7/7 100%
    
     @testing-library/user-event  ^11.4.2  →  ^13.0.16     
     react                        ^17.0.1  →   ^17.0.2     
     react-dom                    ^17.0.1  →   ^17.0.2     
     react-scripts                  4.0.1  →     4.0.3     
     web-vitals                    ^1.1.0  →    ^1.1.1  
    

    尝试在上面之后立即再次运行ncu -u,您将收到如下消息:

    Upgrading /home/ajay/Documents/react-beast/package.json
    [====================] 7/7 100%
    
    All dependencies match the latest package versions :)
    

    之后执行npm install,您应该拥有项目所有依赖项的所有最新版本。

    对我来说,如果我们需要保持我们的 (npm/React) 项目是最新和最好的,而不是浪费时间手动更新版本,那么这是最好和最干净的解决方案(嗯 - 在大多数情况下)。

    【讨论】:

      【解决方案6】:

      如果您想从 package.json 更新任何特定版本,您可以通过执行 ==>

      来更新包的版本

      yarn add package-name@version-number

      npm install --save package-name@version-number

      如果您想将所有软件包更新到最新版本,您可以运行命令 ==>

      npm 审计修复 --force

      【讨论】:

        【解决方案7】:

        一些包是相互依赖的,并且要与彼此相同的版本一起使用......例如最近遇到了 npm react@16.5.2 和 react-dom@16.5.2 的问题。我想用钩子但不能所以我跑了:

        npm update react@latest react-dom@latest
        

        这不起作用...进入了一些 react.js 博客/文档,发现这些特定的包是相互依赖的,并且版本必须相同。要更新这些:

        npm uninstall react
        npm uninstall react-dom
        
        npm install react@^16.8.0 react-dom@^16.8.0
        

        一切正常。寻找稳定的版本。阅读文档。 https://reactjs.org/blog/2019/02/06/react-v16.8.0.html https://reactjs.org/warnings/invalid-hook-call-warning.html

        【讨论】:

          【解决方案8】:

          如果你想更新反应,请在终端上使用npx update react

          【讨论】:

            【解决方案9】:

            您可以通过以下方式将所有依赖项更新到最新版本 npm update

            【讨论】:

              【解决方案10】:

              你可以使用这个命令 npm install -g create-react-app 如果您没有 root 用户权限,则将其与 sudo npm install -g create-react-app

              【讨论】:

                【解决方案11】:

                使用此命令更新反应npm install --save react@16.12.0 不要忘记将 16.12.0 更改为最新版本或您需要设置的版本。

                【讨论】:

                  【解决方案12】:

                  无需安装 react,在 Linux/Mac 的终端或 Windows 的 cmd 中执行以下命令即可:

                  npx create-react-app my-app
                  

                  my-app - 是一个可选名称,您可以随意命名。

                  它将为您的下一个项目创建更新的模板并做好准备!

                  【讨论】:

                    【解决方案13】:

                    在终端运行命令来更新反应版本 $npm i react@next react-dom@next

                    【讨论】:

                    • 您的答案可以通过额外的支持信息得到改进。请edit 添加更多详细信息,例如引用或文档,以便其他人可以确认您的答案是正确的。你可以找到更多关于如何写好答案的信息in the help center
                    猜你喜欢
                    • 1970-01-01
                    • 1970-01-01
                    • 1970-01-01
                    • 2017-04-27
                    • 2022-08-03
                    • 1970-01-01
                    • 1970-01-01
                    • 2018-08-24
                    • 1970-01-01
                    相关资源
                    最近更新 更多