Some packages of old projects have not been updated for a long time, leading to some performance problems in the project. Upgrade packages were considered in the project iteration and relevant information was searched.

Simple “rough” way to upgrade

Of course, some problems caused by the upgrade of the package need to be considered more comprehensively. NPM package Upgrade tool: NPM -check-updates NPM -check Run the following installation commands on the local PC:

NPM install -g NPM -check-updates // Update NPM package ncu-uCopy the code

rightpackage.jsonAll packages are upgraded in a unified manner as follows:

Package installation and upgrade complete, but the project does not run.

  1. First, the first question

Take a closer look at the error message. Webpack reported an error. The previous version of Webpack is 4.12.0. After the upgrade, the version of webpack is 5.37.1. After checking the official version description of Webpack, the startup mode has changed.

// The previous command webpack-dev-server XXX // the new version webpack serveCopy the code
  1. Second question

Webpack. NamedModulesPlugin is not a constructor webpack package 4. XX need to be configured

new webpack.NamedModulesPlugin(),
Copy the code

This configuration is built into WebPack 5 by default and no further configuration is required

  1. Third question

Webpack version 4.12.0Webpack version 5, object fetchingFourth questionI found a lot of online materials, it should be webpack5, but I’m not sure, I got stuck in this step and did not proceed; Due to time constraints, we will not do the upgrade for the moment, and we will continue later when there is time

Elegant and detailed way to upgrade

NPM install -g NPM -check // Check select the upgrade package NPM -check -uCopy the code

Select the corresponding version to upgrade