How to Integrate Egonex-AI Understand Anything with Other Tools

TLDR: Understand Anything exposes browser-safe sub-path entry points from its pnpm-workspace monorepo, allowing you to import the core search engine into applications, embed the React dashboard in custom UIs, or trigger the multi-agent pipeline via CLI from automation tools.

The Egonex-AI Understand Anything repository is structured as a pnpm-workspace monorepo that publishes reusable packages under the @understand-anything scope. The core analysis engine and dashboard UI are separate packages that export browser-safe sub-path entry points—such as @understand-anything/core/search and @understand-anything/core/types—enabling integration into any JavaScript or TypeScript project without pulling in Node-only modules. This architecture allows you to query knowledge graphs programmatically, embed interactive visualizations, or orchestrate analysis through the CLI wrapper.

Install the Core Packages

First, add the published packages to your project dependencies. The monorepo distributes @understand-anything/core for the analysis engine and @understand-anything/dashboard for the React-based visualization interface.

{
  "dependencies": {
    "@understand-anything/core": "^1.0.0",
    "@understand-anything/dashboard": "^1.0.0"
  }
}

After installation, you can import specific sub-modules to avoid bundling unnecessary Node-only code.

Query Knowledge Graphs Programmatically

The @understand-anything/core package exposes a SearchEngine class from the search sub-path. Located in understand-anything-plugin/packages/core/src/search, this class accepts a KnowledgeGraph instance and executes semantic queries against the graph data.

Import the Search Engine in Node.js

To perform programmatic searches, import the SearchEngine and corresponding types from @understand-anything/core/types (defined in understand-anything-plugin/packages/core/src/types). The following example reads a generated knowledge graph from disk and queries for authentication-related nodes:

import { SearchEngine } from "@understand-anything/core/search";
import type { KnowledgeGraph } from "@understand-anything/core/types";
import { readFileSync } from "fs";

async function queryGraph(graph: KnowledgeGraph, term: string) {
  const engine = new SearchEngine(graph);
  const results = await engine.search(term);
  console.log(results);
}

// Load graph from the .understand-anything/ output directory
const graph = JSON.parse(readFileSync("./.understand-anything/knowledge-graph.json", "utf-8"));
queryGraph(graph, "auth");

This approach lets you build custom reporting tools, automated documentation generators, or backend services that consume the structured knowledge output.

Embed the Dashboard in React Applications

The @understand-anything/dashboard package provides a pre-built React component that renders the interactive knowledge graph visualization. The dashboard source lives in understand-anything-plugin/packages/dashboard/src and is configured via Vite (see vite.config.ts in the same directory).

To embed the dashboard in your own application, import the component and configure the graphUrl prop to point to your generated knowledge-graph.json endpoint:

import Dashboard from "@understand-anything/dashboard";

function App() {
  return (
    <Dashboard
      graphUrl="/.understand-anything/knowledge-graph.json"
      accessToken={process.env.UNDERSTAND_TOKEN}
    />
  );
}

The dashboard fetches the graph JSON from the specified URL, making it compatible with static file servers, CDN-hosted assets, or custom API endpoints.

Orchestrate Analysis via the CLI Wrapper

For automation scenarios, the repository includes a CLI wrapper defined in understand-anything-plugin/src/index.ts. This entry point registers the /understand command for LLM-driven tools like Claude Code, Cursor, Copilot, and Gemini CLI.

Running the CLI triggers the multi-agent pipeline, writes the generated knowledge graph to the .understand-anything/ folder, and starts the dashboard server. You can invoke this from CI pipelines, Makefiles, or VS Code tasks using pnpm workspace filters:

# Compile dependencies before running analysis

pnpm --filter @understand-anything/core build
pnpm --filter @understand-anything/skill build

# Execute the understand command

pnpm run understand --full

The pnpm-workspace.yaml file defines the workspace structure, ensuring that cross-package dependencies resolve correctly during the build process.

Generate Test Data for Performance Validation

When integrating with other tools, you may want to validate performance with large knowledge graphs. The repository includes scripts/generate-large-graph.mjs, which creates synthetic graph data for stress testing your integration points.

Summary

• Install scoped packages: Add @understand-anything/core and @understand-anything/dashboard to leverage the search engine and UI components.
• Import sub-paths: Use entry points like @understand-anything/core/search to import only the functionality you need without Node-only dependencies.
• Embed the dashboard: Import the React component from @understand-anything/dashboard and configure the graphUrl prop to visualize your data.
• Automate via CLI: Trigger the multi-agent pipeline using the CLI wrapper in understand-anything-plugin/src/index.ts with pnpm workspace commands.
• Leverage workspace scripts: Use pnpm --filter commands to build specific packages and manage dependencies in the monorepo.

Frequently Asked Questions

Can I use the core library without installing the dashboard?

Yes. The @understand-anything/core package exports browser-safe sub-paths such as search and types, allowing you to import only the analysis engine in Node.js or web applications without pulling in the React dashboard dependencies.

How does the CLI integrate with LLM coding tools?

The CLI wrapper in understand-anything-plugin/src/index.ts registers the /understand command for Claude Code, Cursor, Copilot, Gemini CLI, and similar tools. When invoked, it executes the multi-agent pipeline and outputs the knowledge graph to the .understand-anything/ directory.

Is the dashboard compatible with custom authentication systems?

Yes. The dashboard component accepts an accessToken prop and configurable graphUrl, allowing you to point it to protected endpoints or add custom headers via your React application's fetch configuration.

What package manager is required for building the workspace?

The repository uses pnpm as its package manager. The pnpm-workspace.yaml file defines the monorepo structure, and you must use pnpm --filter commands to build individual packages or run the CLI from the source.

{
  "mcpServers": {
    "instagit": {
      "command": "npx",
      "args": ["-y", "instagit@latest"]
    }
  }
}