import-tree

A powerful CLI tool to visualize and trace JavaScript/TypeScript import trees in your project. Supports both downward (dependencies) and upward (dependents) tracing, with advanced features for large codebases.

Features

• Downward tracing: See all files imported (directly or indirectly) by a given entry file.
• Upward tracing: See all files that import (directly or indirectly) a given file.
• Node modules support: Optionally include dependencies from node_modules.
• Targeted tracing: Show only the paths that reach a specific file (-t flag).
• JS, TS, JSX, TSX support: Works with modern JavaScript and TypeScript projects.
• Colorful, tree-like output: Quickly spot shared dependencies and cycles.
• Version flag: Print the current version of the tool.
• Fast and easy to use: Install globally and run from anywhere in your project.

Installation

npm i -g import-tree

Usage

Basic Downward Tracing

Show all files imported by an entry file:

import-tree src/components/header/header.js

Downward Tracing to a Target File

Show only the branches that reach a specific file:

import-tree src/components/header/header.js -t src/services/endpoints.js

Example Output:

src\components\header\header.js
└── src\services\trans\trans.js
    ├── src\services\index.js
    │   └── src\services\endpoints.js
    └── src\services\endpoints.js

Upward Tracing

Show all files that (directly or indirectly) import a given file:

import-tree src/components/common/Billdesk/Billdesk.js -u

Example Output:

src\components\common\Billdesk\Billdesk.js
└── src\components\pages\SipHouse\PaymentSelection\PaymentMode.js
    ├── src\components\common\Rzaorpay\EmandateRazorpay.js
    │   └── src\components\pages\SipHouse\PaymentSelection\PaymentMode.js
    └── src\components\pages\SipHouse\paymentFlow\index.js
        └── src\components\pages\SipHouse\index.js
            ├── src\components\pages\SipHouse\hooks\useAllFunds.js
            │   └── src\components\pages\SipHouse\selectFund\allFunds\index.js
            │       ├── src\components\pages\SipHouse\hooks\useTabs.js
            │       │   └── src\components\pages\SipHouse\selectFund\MUITabs.js
            │       │       └── src\components\pages\SipHouse\selectFund\index.js
            │       │           └── src\components\pages\SipHouse\index.js
            │       └── src\components\pages\SipHouse\selectFund\index.js
            │           └── src\components\pages\SipHouse\index.js

Upward Tracing to a Target File

Show only the upward paths that reach a specific file:

import-tree src/components/common/Billdesk/Billdesk.js -u -t src/components/pages/SipHouse/index.js

Including Node Modules

By default, node_modules are ignored. To include them in downward tracing:

import-tree src/index.js -n

Show Version

import-tree -v

CLI Options

| Option | Description | | -------------- | --------------------------------------------------------------------------- | | <entry-file> | The file to start tracing from | | -u | Upward tracing (show files that import the entry file) | | -n | Include imports from node_modules (downward tracing only) | | -t <to-file> | Only show branches that reach the specified file | | -v | Show the current version |

Example Scenarios

• Find all dependencies of a component:
  import-tree src/components/Button.js
• Find all files that depend on a utility:
  import-tree src/utils/logger.js -u
• Trace a path from one file to another:
  import-tree src/App.js -t src/utils/api.js
• Include third-party modules:
  import-tree src/App.js -n
• Check version:
  import-tree -v

License

MIT

Contributions and feedback are welcome!