How can I find versions of NPM modules with specific dependencies - for example, which version of webpack-cli to use with webpack@4.46.0?

I've been asked to upgrade a project to use webpack version 4, and I need to upgrade various loaders and so on to the compatible versions.

So far it's been laborious and slow, and I don't know if I'm getting closer to a solution or not.

As I mentioned in the question, I upgraded webpack to version 4.46.0 but now of course need to upgrade webpack-cli (as well as many other libraries). I want to find the highest version of webpack-cli that's compatible with webpack@4.46.0. After some trial and error, I found that webpack-cli@3.3.12 seems to be the correct version (and not webpack-cli@4.x).

But then of course there are modules that depend on other modules (and so on), which makes figuring out the right versions especially hard.

Are there any automated tools to help with this process?

Solution

Unfortunately, no silver bullet! There is no direct automated way to do that. In general, you have to go through documentation of each Webpack loader and plugin and find appropriate version.

There are few guidelines that can help you:

Loaders - Latest versions of Webpack loaders should work any version of Webpack from version 2 onward.
Plugins - Webpack plugins usually cause breaking changes across version. That's where you must test extensively.
CLI - Webpack CLI and Webpack are quite independent from one another. In theory, not too much breaking changes. Webpack CLI is literally a small wrapper around Webpack and thus, you can start from the topmost version and then go backwards.
Certain loaders have dependency on other modules which has a strict requirement set. For example. Babel loader has a strict dependency on Babel (babel-loader 8 needs babel 7.x) and same for sass-loader. You must strictly follow those dependencies carefully.