How to view the dependency tree of a given npm module?

Question

How can I get the tree of a module available to npm, but not installed locally ?

npm ll does the job for locally installed packages. But it doesn't work for modules not installed or modules installed globally.

I tried npm list bower but that's not it.

Kildare

If all you're after is a dependency graph, npm.broofa.com and npm.anvaka.com will do this for publicly published modules. – Wrongdoing

@Wrongdoing thanks for those links ! I suggest you post them as answers. I checked both on @angular/cli and npm.anvaka.com is sluggish and unreadable, but npm.broofa.com does a great job out of it – Kildare

Answer 1

You can use the npm-remote-ls module. You can install it globally:

npm install -g npm-remote-ls

And then call:

npm-remote-ls bower

---

Alternatively, [email protected] installed then you can use npx and avoid globally installing the command - just call:

npx npm-remote-ls bower

Autograft

How to see modules that depend on a given module? – Neogothic

this is still needed? even with newer versions of npm? – Rupertruperta

for a specific version you can use this syntax npm-remote-ls [email protected] – Rupertruperta

@orad: If it is one you have installed, npm ls – Ferriferous

Is bower a bad example? When I install npm-remote-ls globally and then run npm-remote-ls bower, the only response I get is: └─ [email protected]. – When I run npm-remote-ls jasmine I actually get something that looks like a tree.(!) – Heavily

Answer 2

You can generate NPM dependency trees without the need of installing a dependency by using the command

npm ls --all

This will generate a dependency tree for the project at the current directory and print it to the console. (The all option shows all transitive dependencies, not just those directly depended upon by the current project - see the documentation.)

You can get the dependency tree of a specific dependency like so:

npm ls [dependency]

You can also set the maximum depth level by doing

npm ls --depth=[depth]

Note that you can only view the dependency tree of a dependency that you have installed either globally, or locally to the NPM project.

Wallraff

Your second one only prints the packages that depend on [dependency], it doesn't print dependencies of [dependency]. OP also specifically said that that is not what he's looking for. – Woozy

Use -prod to only list production dependencies (and no devDependencies). – Hedonics

npm list and npm ls both read the node_modules folder, you aren't able to get a tree without installing the dependencies first. – Overstep

npm list --depth=1 for one level – Wershba

How come this is not documented? docs.npmjs.com/cli/v7/commands – Divider

@RetoHöhener It's documented under the name npm ls. npm list is one of the command's aliases. – Grizzled

Using npm list --prod --all I was able to get the full tree – Landon

@EdRandall indeed, npm ls -a does the job well. – Ong

This command only works for all tree, not a package dependencies. – Empale

Answer 3

This site allows you to view a packages tree as a node graph in 2D or 3D.

http://npm.anvaka.com/#/view/2d/waterline

Great work from @Avanka!

Probation

Amazing "npm.anvaka.com/#/view/2d/no-one-left-behind" "Depends on every package in npm". :D – Melanymelaphyre

Crashes the heck out of Chrome 79.0.3945.130 (Official Build) (64-bit) on Mac – Inductive

Useless for private modules – Inappetence

Answer 4

Here is the unpowerful official command:

npm view <PACKAGE> dependencies

It prints only the direct dependencies, not the whole tree.

Pavier

Does the package have to be installed? .\npm view core-js dependencies returns nothing on my machine. – Flinger

@Flinger No, it doesn't have to be installed. core-js has no dependencies. – Especial

Answer 5

You can use howfat which also displays dependency statistics:

npx howfat jasmine

Iiette

Answer 6

If you want to get the actually dependency path of specific package and want to know why you have it, you can simply ask yarn why <MODULE>. example:

    $> yarn why mime-db
    yarn why v1.5.1
    [1/4] Why do we have the module "mime-db"...?
    [2/4] Initialising dependency graph...
    [3/4] Finding dependency...
    [4/4] Calculating file sizes...
    => Found "[email protected]"
    info Reasons this module exists
       - "coveralls#request#mime-types" depends on it
       - Hoisted from "coveralls#request#mime-types#mime-db"
    info Disk size without dependencies: "196kB"
    info Disk size with unique dependencies: "196kB"
    info Disk size with transitive dependencies: "196kB"
    info Number of shared dependencies: 0
    Done in 0.65s.

Flabellum

But it doesn't which version of which things, and which versions they explicitly bring in. This output is borderline useless in diagnosing dependency issues. – Uracil

pnpm why also works. – Jury

But I want to see the full tree which led to this – Thetisa

Answer 7

This command output all modules with dependencies in a tree structure:

npm ls -a

Pood

Answer 8

View All the metadata about npm module

npm view mongoose(module name)

View All Dependencies of module

npm view mongoose dependencies

View All Version or Versions module

npm view mongoose version
npm view mongoose versions

View All the keywords

npm view mongoose keywords

Conspicuous

Answer 9

If you are using yarn, then you can go with yarn list from the root directory of the project. It'll give you a tree like structure of all the transitive dependencies like below:

├─ @ampproject/[email protected]
│  ├─ [email protected]
│  └─ [email protected]
├─ @ampproject/[email protected]
│  ├─ @ampproject/toolbox-core@^2.6.0
│  ├─ @ampproject/toolbox-runtime-version@^2.7.0-alpha.1
│  ├─ @ampproject/toolbox-script-csp@^2.5.4
│  ├─ @ampproject/toolbox-validator-rules@^2.5.4
│  ├─ [email protected]
│  ├─ [email protected]
│  ├─ [email protected]
│  │  └─ [email protected]
│  ├─ [email protected]
│  │  ├─ caniuse-lite@^1.0.30001093
│  │  ├─ postcss@^7.0.32
│  │  └─ [email protected]
│  │     ├─ chalk@^2.4.2
│  │     ├─ source-map@^0.6.1
│  │     └─ supports-color@^6.1.0

Maximilianus

Answer 10

There is also a nice web app to see the dependencies in a weighted map kind of view.

For example:

https://bundlephobia.com/[email protected]

Matador

I've checked the link - it works for me as of today. Maybe it was down for a while – Matador

Answer 11

To get it as a list:

% npx npm-remote-ls --flatten dugite -d false -o false
[
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '@szmarczak/[email protected]',
  '[email protected]',
  '@sindresorhus/[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]',
  '[email protected]'
]

Abscind

This package breaks for large lists of deps (try lighthouse for an example). – Dietrich

Answer 12

Unfortunately npm still doesn't have a way to view dependencies of non-installed packages. Not even a package's page list the dependencies correctly. 🙄

Luckily installing yarn:

brew install yarn

Allows one to use its info command to view accurate dependencies:

yarn info @angular/[email protected] dependencies

yarn info @angular/[email protected] peerDependencies

Rumsey

Why does yarn provide and accurate way to view dependencies and npm provides NO way to view dependencies, could this be because npm is not deterministic and yarn is? – Inductive

Answer 13

https://github.com/SnailSword/npm-shovel

npx npm-shovel react

output:

react's dependencies:

||--react
|  |--loose-envify@^1.1.0
|    |--js-tokens@^3.0.0 || ^4.0.0
|  |--object-assign@^4.1.1
|  |--prop-types@^15.6.2
|    |--loose-envify@^1.4.0
|      |--js-tokens@^3.0.0 || ^4.0.0 *
|    |--object-assign@^4.1.1 *
|    |--react-is@^16.8.1

Jene