Search code examples
npmupgradepackage.jsonnpm-scripts

How to determine the dependencies of older npm package versions


It appears to me that the dependency linkage on the npm site is only applicable to the current/latest version.

Is there some tidbit of information that I'm not aware of on how to determine what dependency version a package has other than by downloading it and inspecting the package.json file?

I feel like I'm wasting HOURS doing something I would expect to be much easier to do.


Solution

  • "It appears to me that the dependency linkage on the npm site is only applicable to the current/latest version."

    Yes that's correct, www.npmjs.com will only show the dependencies for the latest version of a package.

    Here are a couple of ways to discover what you want both programmatically and non-programmatically.

    Programmatically:

    1. Utilizing the npm view command with the following syntax;

      npm view <pkg_name> versions --json
      

      obtains a list of all versions available for a given package in the npm registry.

      Note: The <pkg_name> part above should be substituted with the real package name.

      For instance; running the following command for let's say the eslint package:

      npm view eslint versions --json
      

      prints the following to the console:

      [
        "0.0.4",
        "0.0.5",
        "0.0.6",
        "0.0.7",
        "0.1.0-dev",
        "0.1.0",
        "0.1.1",
        "0.1.2",
        ...
      ]
      
    2. Now we know what versions are available, let's say we want to list the dependencies for eslint version 0.1.2 we can run the following command:

      npm show [email protected] dependencies --json
      

      This will print:

      {
        "optimist": "*",
        "estraverse": "~1.3.0",
        "esprima": "*",
        "escope": "1.0.0"
      }
      

      Similarly, we can discover the devDependencies for eslint version 0.1.2 by running the following command instead:

      npm show [email protected] devDependencies --json
      

      This will yield something like this:

      {
        "vows": "~0.7.0",
        "sinon": "*",
        "commonjs-everywhere": "~0.9.0",
        "mocha": "~1.13.0",
        "chai": "~1.8.1",
        "grunt": "~0.4.1",
        ...
      }
      
    3. If you know that a package has a particular dependency in advance.

      For instance; retrospectively after running the aforementioned command we now know that eslint version 0.1.2 has escope listed as a dependency.

      So, if we wanted to know the version of escope that eslint version 0.1.2 needs, we can run the following command:

      npm show [email protected] dependencies.escope
                                        ^
      

      Note: The package name follows the dot (.), i.e. .escope

      This prints the following:

      1.0.0


    The non-programmatic way

    I can't think of a reason why you would want to perform the following non-programmatic way instead of the aforementioned programmatic way when you have a CLI tool available to you. However, if you prefer manual tasks then here goes...

    Note: YMMV using the following manual steps as it depends on how the package has been managed/maintained.

    Typically, the source code of an npm package will be hosted on GitHub, so you can perform the following manual steps. This will avoid you having to download the package to inspect the package.json file.

    For this we'll demonstrate for the eslint package:

    1. Visit npmjs.com and type the name of the package in the "Search Packages" input field. We'll type eslint and hit the return key.

    2. Next click eslint from the list of packages, which will take you to this page.

    3. Click on the github link which typically appears on the right-hand side of the webpage and looks like this:

      github rep link icon

    4. That will take you to the eslint repo, i.e. this one

    5. On the Github page click the "Branch" button - which appears above the list of source code files, and looks like this:

      Github branch button

    6. In the pop-up panel that subsequently appears click the "Tags" button, then locate and click the version tag from the list that you want to discover it's dependencies. (Note: These tag names will typically correspond to the version released/published to npm)

      This will then load the source code files in the browser for that particular release/version.

    7. Locate the package.json file from the list of files and click it. This will load the contents of package.json in the browser, upon which you can read it and ascertain its dependencies.


    Visualizing the dependency tree

    I sometimes utilize this online tool https://npm.anvaka.com which can help you to visualize the complete dependency tree/graph for a given package - however it's for the latest version of a package only.

    Here is the complete dependency tree/graph (many levels deep) for the latest version of eslint.