If you’re working with NextJS in Cursor, you’ve probably noticed that the agent doesn’t always follow the existing structure of your code base. E.g. it’ll randomly create new routes or interfaces instead of using the available ones, or “fix” an existing hook in order to make it work with a new component, while other components depended on the existing hook, thus breaking your other components.
In order to overcome these issues I’ve created a small vscode/cursor extension, which analyzes your codebase (on command) and creates a few markdown files under a .dependencies folder in the root of your project with all the relevant dependencies of your project.
These markdown files are easily digested by the agent and depending on the size of your code base and excluded folders you set in the extension’s configuration, these files are only a few hundred lines long. These markdown files also provide you valuable insight about possible duplicate/redundant functions, types and routes.
If you’d like to give it a try, then you can download the source files here:
SlippyDong/nextjs-dependency-tracker: vscode extension to create dependency reports in markdown
or the VSIX extension here:
Releases · SlippyDong/nextjs-dependency-tracker
I haven’t released it on the vscode market place, but it’s quite easy to install the extension manually.
How it works:
The Next.js Dependency Tracker extension works by:
-
Static Analysis: When triggered, it scans your entire Next.js project, analyzing TypeScript/JavaScript files to identify:
- Exports (functions, components, types)
- Imports and their relationships
- Framework-specific patterns like route handlers and server actions
-
Dependency Resolution: It builds a dependency report in markdown, showing which exports are used and where, tracking relationships between files.
-
Output Generation: The extension creates five markdown reports in a
.dependenciesfolder:- Used exports and where they’re used
- Potentially unused exports
- Interface/type definitions
- Next.js routes structure
- Missing/unresolved imports
-
Framework Intelligence: It specifically understands Next.js patterns, automatically marking components like page files, route handlers, and server actions as “used by framework” even when not directly imported.
You can run the analyzer via the command palette (CTRL+SHIFT+P) with “Dependency Tracker: Scan Project”
Disclaimer:
The tool is not perfect and only follows direct relations between exports and imports. It doesn’t track re-export chains through index files, so you may find “unused” exports which are actually used. This is just a tool to assist you and the code agent to understand the code base, dependencies and flow better, minimizing the chances for adding redundancies and duplicate code. If you’d like to improve upon the logic then feel free to clone the repository.