A CLI tool to generate interactive visual maps in HTML showing dependencies, packages, and links between them. Perfect for analyzing and visualizing relationships between modules in Node.js projects.
Visualize your project's architecture in a simple and interactive way.
Broch is a command-line interface (CLI) tool designed to analyze your project's structure and generate an interactive dependency map. With Broch, you can get a clear and graphical view of how your files are interconnected, making it easier to understand, maintain, and debug your code.
Automatic Dependency Analysis: Detects import, require, include, and more relationships in JavaScript, TypeScript, HTML, CSS, and PHP files.
Interactive Visualization: Generates a dynamic HTML map using vis-network that allows you to explore your project's connections intuitively.
High Customization: Configure colors, labels, and output filename through a simple broch.config.json file.
Easy to Use: With just a couple of commands, you can have a complete view of your project's architecture.
To start using Broch, make sure you have Node.js (version 12 or higher) installed on your system. Then, install the package globally through npm:
npm i -g broch
By installing it globally, you'll be able to run the broch command from any directory.
Broch is very simple to use. Here are the available commands.
broch map
This is the heart of Broch. It scans a directory (of your choice) and generates the dependency map.
Alias:
broch m
Usage Examples:
Scan selected directory: Simply run the command in your project's root, and broch will give you a list of current directories, select the one you want, and you're done.
broch preview
Once you've generated the map, this command will allow you to open it directly in your browser.
Alias:
broch p
Usage Example:
This command will look for the brochMap.html file (or the name you've configured) and open it.
broch version
Shows the version of Broch you have installed.
Alias:
broch v
broch
broch help
Shows a summary of available commands and options.
Alias:
broch h
{
"outputFileName": "brochMap.html",
"colors": {
"html": "#E44D26",
"css": "#1572B6",
"js": "#F7DF1E",
"php": "#777BB4",
"image": "#4CAF50",
"rust": "#DE3423",
"json": "#000000",
"yml": "#cb171e",
"md": "#000000",
"py": "#3776AB",
"java": "#b07219",
"other": "#CCCCCC"
},
"labels": {
"js": "JS/TS",
"yml": "YML",
"md": "Markdown",
"py": "Python",
"java": "Java"
}
}
The first time you run Broch, a broch.config.json file will be automatically created in your directory. This file allows you to customize the tool according to your preferences.
outputFileName: Define the name of the HTML file that will be generated.
colors: Assign a color to each file type according to its extension. Feel free to add or modify as many as you want!
labels: Allows you to define custom labels for the color legend in the map, making visualization even clearer.
Copyright © 2025 Jan Queralt
Hereby, permission is granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
First off, thank you for considering contributing to Broch! Your help is essential for keeping it great.
Contributions are what make the open-source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated 💕.
We welcome contributions of all kinds, including bug reports, feature requests, documentation improvements, and code enhancements.
Before creating a new contribution, please check the Issues page to see if a similar one already exists.
If you want to contribute with code, please follow these steps:
Fork the Repository Click the "Fork" button at the top right of this page to create your own copy of the repository.
Clone Your Fork Clone the repository to your local machine:
git clone
https://github.com/YOUR_USERNAME/broch.git
cd broch
Set Up Your Environment
Install the project dependencies and link your local copy to make the broch command available globally for testing.
# Install dependencies
npm install
# Link the package to use the 'broch' command locally
npm link
and if npm link doesn't work try
npm link broch
The npm link command is crucial as it allows you to run and test your local version of Broch from any directory on your system.
Create a New Branch Create a descriptive branch for your changes. It's a good practice to name it based on the feature or fix you are working on.
# Example for a new feature
git checkout -b feature/add-new-parser
# Example for a bug fix
git checkout -b fix/resolve-rendering-issue
Make Your Changes Write your code, fix the bug, or improve the documentation. Make sure your changes are clean and follow the existing code style.
Commit Your Changes Commit your changes with a clear and concise message, following conventional commit standards if possible.
git commit -m "feat: Add support for YAML configuration files"
Push to Your Fork Push your changes to your forked repository.
git push origin feature/add-new-parser
Open a Pull Request Go to the original Broch repository and open a new Pull Request. Provide a clear title and a detailed description of the changes you've made, linking to any relevant issues.
To ensure our community is welcoming and respectful, please read and follow our Code of Conduct. By participating in this project, you agree to abide by its terms.
Thank you again for your interest in contributing to Broch!
Features · Installation · Commands · Configuration · License · Contribution · Code of Conduct · Repository · Issues · NPM
Quick commands: broch map · broch preview · broch version · broch help
© 2025 Jan Queralt · MIT License · To contribute or report issues, open an Issue in the repository.
FAQs
A CLI tool to generate interactive visual maps in HTML showing dependencies, packages, and links between them. Perfect for analyzing and visualizing relationships between modules in Node.js projects.
The npm package broch receives a total of 8 weekly downloads. As such, broch popularity was classified as not popular.
We found that broch demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Multiple high-impact npm maintainers confirm they have been targeted in the same social engineering campaign that compromised Axios.
Security News
Axios compromise traced to social engineering, showing how attacks on maintainers can bypass controls and expose the broader software supply chain.
Security News
Node.js has paused its bug bounty program after funding ended, removing payouts for vulnerability reports but keeping its security process unchanged.