easy-dep-graph 1.1.1 → 1.1.3

package/bin/index.js

@@ -5,313 +5,299 @@ import fastify from "fastify";
 import open from "open";
 import fs from "node:fs";
 import path from "node:path";
+import semver from "semver";
 let flatDeps;
 void (async function main() {
-  // Check if peer dependencies mode
-  const peerDependenciesMode =
-    process.argv.findIndex((a) => a.toLowerCase() === "--peer-dependencies") !==
-    -1;
-  // List of packages user wants to see the dependencies
-  const packagesArgIndex = process.argv.findIndex(
-    (a) => a.toLowerCase() === "--packages",
-  );
-  const packagesFilter =
-    packagesArgIndex !== -1 ? process.argv[packagesArgIndex + 1] : undefined;
-  // Only get the dependents of a specific package
-  const packageArgIndex = process.argv.findIndex(
-    (a) => a.toLowerCase() === "--package-dependents",
-  );
-  const packageName =
-    packageArgIndex !== -1 ? process.argv[packageArgIndex + 1] : undefined;
-  // Get port number
-  const portArgIndex = process.argv.findIndex(
-    (a) => a.toLowerCase() === "--port",
-  );
-  const port = portArgIndex !== -1 ? +process.argv[portArgIndex + 1] : 8080;
-  // Get if should not open browser
-  const shouldOpenBrowser =
-    process.argv.findIndex((a) => a.toLowerCase() === "--no-open") === -1;
-  // Get if should not apply force layout
-  const shouldApplyForceLayout =
-    process.argv.findIndex((a) => a.toLowerCase() === "--no-force-layout") ===
-    -1;
-  if (peerDependenciesMode) {
-    await runPeerDependenciesMode(port, shouldOpenBrowser);
-    return;
-  }
-  // Run npm list command
-  const result = shell.exec(`npm list --json ${packageName ?? "--all"}`, {
-    windowsHide: true,
-    silent: true,
-  });
-  // Parse the result to a JSON object
-  const packageInfo = JSON.parse(result.stdout);
-  console.log(`Generating dependency graph for: "${packageInfo.name}"...`);
-  // Filter dependencies if needed
-  if (packagesFilter != null) {
-    const packagesFilterList = packagesFilter.split(",").map((d) => d.trim());
-    for (const key of Object.keys(packageInfo.dependencies)) {
-      if (!packagesFilterList.includes(key)) {
-        delete packageInfo.dependencies[key];
-      }
+    // Check if peer dependencies mode
+    const peerDependenciesMode = process.argv.findIndex((a) => a.toLowerCase() === "--peer-dependencies") !==
+        -1;
+    // List of packages user wants to see the dependencies
+    const packagesArgIndex = process.argv.findIndex((a) => a.toLowerCase() === "--packages");
+    const packagesFilter = packagesArgIndex !== -1 ? process.argv[packagesArgIndex + 1] : undefined;
+    // Only get the dependents of a specific package
+    const packageArgIndex = process.argv.findIndex((a) => a.toLowerCase() === "--package-dependents");
+    const packageName = packageArgIndex !== -1 ? process.argv[packageArgIndex + 1] : undefined;
+    // Get port number
+    const portArgIndex = process.argv.findIndex((a) => a.toLowerCase() === "--port");
+    const port = portArgIndex !== -1 ? +process.argv[portArgIndex + 1] : 8080;
+    // Get if should not open browser
+    const shouldOpenBrowser = process.argv.findIndex((a) => a.toLowerCase() === "--no-open") === -1;
+    // Get if should not apply force layout
+    const shouldApplyForceLayout = process.argv.findIndex((a) => a.toLowerCase() === "--no-force-layout") ===
+        -1;
+    if (peerDependenciesMode) {
+        await runPeerDependenciesMode(port, shouldOpenBrowser);
+        return;
     }
-  }
-  // Flat the dependencies from npm list
-  flatDeps = {};
-  flatDepsRecursive(packageInfo.dependencies);
-  // Turn deps into nodes and edges
-  const nodeEntries = Object.entries(flatDeps);
-  const nodeCount = nodeEntries.length;
-  const data = {
-    name: packageInfo.name,
-    applyForceLayout: shouldApplyForceLayout,
-    nodes: JSON.stringify(
-      nodeEntries.map((dep, index) => {
-        return {
-          key: dep[0],
-          label: `${dep[0]} V${dep[1].version}`,
-          x: Math.random() * 100 - 50,
-          y: Math.random() * 100 - 50,
-          size: 10,
-          color: dep[1].isRoot ? "#22c55e" : "#3b82f6",
-        };
-      }),
-    ),
-    edges: JSON.stringify(
-      Object.entries(flatDeps)
-        .filter((dep) => !!dep[1].dependencies.length)
-        .flatMap((dep) =>
-          dep[1].dependencies.map((d) => ({
+    // Run npm list command
+    const result = shell.exec(`npm list --json ${packageName ?? "--all"}`, {
+        windowsHide: true,
+        silent: true,
+    });
+    // Parse the result to a JSON object
+    const packageInfo = JSON.parse(result.stdout);
+    console.log(`Generating dependency graph for: "${packageInfo.name}"...`);
+    // Filter dependencies if needed
+    if (packagesFilter != null) {
+        const packagesFilterList = packagesFilter.split(",").map((d) => d.trim());
+        for (const key of Object.keys(packageInfo.dependencies)) {
+            if (!packagesFilterList.includes(key)) {
+                delete packageInfo.dependencies[key];
+            }
+        }
+    }
+    // Flat the dependencies from npm list
+    flatDeps = {};
+    flatDepsRecursive(packageInfo.dependencies);
+    // Turn deps into nodes and edges
+    const nodeEntries = Object.entries(flatDeps);
+    const nodeCount = nodeEntries.length;
+    const data = {
+        name: packageInfo.name,
+        applyForceLayout: shouldApplyForceLayout,
+        nodes: JSON.stringify(nodeEntries.map((dep, index) => {
+            let x, y;
+            if (shouldApplyForceLayout) {
+                // Random initial position for force layout
+                x = Math.random() * 100 - 50;
+                y = Math.random() * 100 - 50;
+            }
+            else {
+                // Arrange in a circle with equal spacing
+                const radius = Math.max(50, nodeCount * 3);
+                const angle = (index / nodeCount) * 2 * Math.PI;
+                x = Math.cos(angle) * radius;
+                y = Math.sin(angle) * radius;
+            }
+            return {
+                key: dep[0],
+                label: `${dep[0]} V${dep[1].version}`,
+                x,
+                y,
+                size: 10,
+                color: dep[1].isRoot ? "#22c55e" : "#3b82f6",
+            };
+        })),
+        edges: JSON.stringify(Object.entries(flatDeps)
+            .filter((dep) => !!dep[1].dependencies.length)
+            .flatMap((dep) => dep[1].dependencies.map((d) => ({
             source: dep[0],
             target: d,
-          })),
-        ),
-    ),
-  };
-  // Render the UI using mustache
-  const html = mustache.render(getTemplate(), data);
-  // Initialize server to serve graph
-  const app = fastify({
-    logger: false,
-  });
-  app.get("/", (_req, resp) => resp.type("text/html").send(html));
-  // Run the server
-  app.listen({ port }, (err, address) => {
-    if (err) throw err;
-    console.log(`Done! Visit "${address}" to see dependecy graph.`);
-    if (shouldOpenBrowser) open(address);
-  });
+        })))),
+    };
+    // Render the UI using mustache
+    const html = mustache.render(getTemplate(), data);
+    // Initialize server to serve graph
+    const app = fastify({
+        logger: false,
+    });
+    app.get("/", (_req, resp) => resp.type("text/html").send(html));
+    // Run the server
+    app.listen({ port }, (err, address) => {
+        if (err)
+            throw err;
+        console.log(`Done! Visit "${address}" to see dependecy graph.`);
+        if (shouldOpenBrowser)
+            open(address);
+    });
 })();
 function flatDepsRecursive(deps, parentDepName) {
-  if (deps == null) return;
-  for (const dep of Object.entries(deps)) {
-    const depName = dep[0];
-    const depInfo = dep[1];
-    const isRoot = parentDepName == null;
-    if (!isRoot) {
-      const parentDep = flatDeps[parentDepName];
-      parentDep.dependencies.push(depName);
-    }
-    if (flatDeps[depName] == null) {
-      flatDeps[depName] = {
-        version: depInfo.version,
-        isRoot,
-        dependencies: [],
-      };
+    if (deps == null)
+        return;
+    for (const dep of Object.entries(deps)) {
+        const depName = dep[0];
+        const depInfo = dep[1];
+        const isRoot = parentDepName == null;
+        if (!isRoot) {
+            const parentDep = flatDeps[parentDepName];
+            parentDep.dependencies.push(depName);
+        }
+        if (flatDeps[depName] == null) {
+            flatDeps[depName] = {
+                version: depInfo.version,
+                isRoot,
+                dependencies: [],
+            };
+        }
+        flatDepsRecursive(depInfo.dependencies, depName);
     }
-    flatDepsRecursive(depInfo.dependencies, depName);
-  }
 }
 async function runPeerDependenciesMode(port, shouldOpenBrowser) {
-  console.log("Analyzing peer dependencies...");
-  // Get the current project's package.json
-  const packageJsonPath = path.join(process.cwd(), "package.json");
-  const packageJson = JSON.parse(fs.readFileSync(packageJsonPath, "utf-8"));
-  const installedPackages = {
-    ...packageJson.dependencies,
-    ...packageJson.devDependencies,
-  };
-  // Run npm list to get all dependencies
-  const result = shell.exec("npm list --json --all", {
-    windowsHide: true,
-    silent: true,
-  });
-  const packageInfo = JSON.parse(result.stdout);
-  // Collect all package names from the dependency tree
-  const allPackageNames = new Set();
-  collectAllPackageNames(packageInfo.dependencies, allPackageNames);
-  // Collect all peer dependencies by reading package.json files
-  const peerDeps = collectPeerDependenciesFromNodeModules(allPackageNames);
-  // Resolve versions
-  const peerDepsList = Object.entries(peerDeps).map(([name, info]) => {
-    const resolvedVersion = resolveVersion(info.versions);
-    const isInstalled = installedPackages[name] !== undefined;
-    return {
-      name,
-      version: resolvedVersion.version,
-      isConflict: resolvedVersion.isConflict,
-      requiredBy: info.requiredBy,
-      isInstalled,
+    console.log("Analyzing peer dependencies...");
+    // Get the current project's package.json
+    const packageJsonPath = path.join(process.cwd(), "package.json");
+    const packageJson = JSON.parse(fs.readFileSync(packageJsonPath, "utf-8"));
+    const installedPackages = {
+        ...packageJson.dependencies,
+        ...packageJson.devDependencies,
     };
-  });
-  // Sort by name
-  peerDepsList.sort((a, b) => a.name.localeCompare(b.name));
-  const data = {
-    projectName: packageJson.name,
-    peerDeps: peerDepsList,
-  };
-  // Render the UI using mustache
-  const html = mustache.render(getPeerDepsTemplate(), data);
-  // Initialize server to serve graph
-  const app = fastify({
-    logger: false,
-  });
-  app.get("/", (_req, resp) => resp.type("text/html").send(html));
-  app.post("/install", async (req, resp) => {
-    const { package: pkg, version } = req.body;
-    console.log(`Installing ${pkg}@${version}...`);
-    const installResult = shell.exec(`npm install ${pkg}@${version}`, {
-      windowsHide: true,
-      silent: true,
+    // Collect all peer dependencies recursively starting from installed packages
+    const peerDeps = collectPeerDependenciesRecursively(installedPackages);
+    // Resolve versions
+    const peerDepsList = Object.entries(peerDeps).map(([name, info]) => {
+        const resolvedVersion = resolveVersion(info.versions);
+        const isInPackageJson = installedPackages[name] !== undefined;
+        // Check if installed in node_modules (even if not in package.json)
+        const nodeModulesPath = path.join(process.cwd(), "node_modules");
+        const pkgPath = path.join(nodeModulesPath, name, "package.json");
+        const existsInNodeModules = fs.existsSync(pkgPath);
+        const isInstalledByDependency = existsInNodeModules && !isInPackageJson;
+        return {
+            name,
+            version: resolvedVersion.version,
+            isConflict: resolvedVersion.isConflict,
+            requiredBy: info.requiredBy,
+            isInstalled: isInPackageJson,
+            isInstalledByDependency,
+        };
     });
-    if (installResult.code === 0) {
-      console.log(`Successfully installed ${pkg}@${version}`);
-      return {
-        success: true,
-        message: `Successfully installed ${pkg}@${version}`,
-      };
-    } else {
-      console.error(`Failed to install ${pkg}@${version}`);
-      return {
-        success: false,
-        message: installResult.stderr || "Installation failed",
-      };
-    }
-  });
-  // Run the server
-  app.listen({ port }, (err, address) => {
-    if (err) throw err;
-    console.log(`Done! Visit "${address}" to see peer dependencies.`);
-    if (shouldOpenBrowser) open(address);
-  });
-}
-function collectAllPackageNames(deps, packageNames) {
-  if (deps == null) return;
-  for (const [depName, depInfo] of Object.entries(deps)) {
-    packageNames.add(depName);
-    if (depInfo.dependencies) {
-      collectAllPackageNames(depInfo.dependencies, packageNames);
-    }
-  }
-}
-function collectPeerDependenciesFromNodeModules(packageNames) {
-  const peerDeps = {};
-  const nodeModulesPath = path.join(process.cwd(), "node_modules");
-  for (const packageName of packageNames) {
-    try {
-      const pkgJsonPath = path.join(
-        nodeModulesPath,
-        packageName,
-        "package.json",
-      );
-      if (!fs.existsSync(pkgJsonPath)) {
-        continue;
-      }
-      const pkgJson = JSON.parse(fs.readFileSync(pkgJsonPath, "utf-8"));
-      if (pkgJson.peerDependencies) {
-        for (const [peerDepName, peerDepVersion] of Object.entries(
-          pkgJson.peerDependencies,
-        )) {
-          if (!peerDeps[peerDepName]) {
-            peerDeps[peerDepName] = {
-              versions: [],
-              requiredBy: [],
+    // Sort by name
+    peerDepsList.sort((a, b) => a.name.localeCompare(b.name));
+    const data = {
+        projectName: packageJson.name,
+        peerDeps: peerDepsList,
+    };
+    // Render the UI using mustache
+    const html = mustache.render(getPeerDepsTemplate(), data);
+    // Initialize server to serve graph
+    const app = fastify({
+        logger: false,
+    });
+    app.get("/", (_req, resp) => resp.type("text/html").send(html));
+    app.post("/install", async (req, resp) => {
+        const { package: pkg, version } = req.body;
+        console.log(`Installing ${pkg}@${version}...`);
+        const installResult = shell.exec(`npm install ${pkg}@${version}`, {
+            windowsHide: true,
+            silent: true,
+        });
+        if (installResult.code === 0) {
+            console.log(`Successfully installed ${pkg}@${version}`);
+            return {
+                success: true,
+                message: `Successfully installed ${pkg}@${version}`,
             };
-          }
-          const versionStr = peerDepVersion;
-          if (!peerDeps[peerDepName].versions.includes(versionStr)) {
-            peerDeps[peerDepName].versions.push(versionStr);
-          }
-          if (!peerDeps[peerDepName].requiredBy.includes(packageName)) {
-            peerDeps[peerDepName].requiredBy.push(packageName);
-          }
         }
-      }
-    } catch (error) {
-      // Skip packages that can't be read
-      console.warn(`Warning: Could not read package.json for ${packageName}`);
-    }
-  }
-  return peerDeps;
+        else {
+            console.error(`Failed to install ${pkg}@${version}`);
+            return {
+                success: false,
+                message: installResult.stderr || "Installation failed",
+            };
+        }
+    });
+    // Run the server
+    app.listen({ port }, (err, address) => {
+        if (err)
+            throw err;
+        console.log(`Done! Visit "${address}" to see peer dependencies.`);
+        if (shouldOpenBrowser)
+            open(address);
+    });
 }
-function collectPeerDependencies(deps, peerDeps = {}, parentName) {
-  if (deps == null) return peerDeps;
-  for (const [depName, depInfo] of Object.entries(deps)) {
-    // Check if this dependency has peer dependencies
-    if (depInfo.peerDependencies) {
-      for (const [peerDepName, peerDepVersion] of Object.entries(
-        depInfo.peerDependencies,
-      )) {
-        if (!peerDeps[peerDepName]) {
-          peerDeps[peerDepName] = {
-            versions: [],
-            requiredBy: [],
-          };
+function collectPeerDependenciesRecursively(initialPackages) {
+    const peerDeps = {};
+    const nodeModulesPath = path.join(process.cwd(), "node_modules");
+    const visited = new Set();
+    const queue = Object.keys(initialPackages);
+    while (queue.length > 0) {
+        const packageName = queue.shift();
+        // Skip if already processed
+        if (visited.has(packageName)) {
+            continue;
         }
-        if (!peerDeps[peerDepName].versions.includes(peerDepVersion)) {
-          peerDeps[peerDepName].versions.push(peerDepVersion);
+        visited.add(packageName);
+        try {
+            const pkgJsonPath = path.join(nodeModulesPath, packageName, "package.json");
+            if (!fs.existsSync(pkgJsonPath)) {
+                continue;
+            }
+            const pkgJson = JSON.parse(fs.readFileSync(pkgJsonPath, "utf-8"));
+            // Collect peer dependencies
+            if (pkgJson.peerDependencies) {
+                for (const [peerDepName, peerDepVersion] of Object.entries(pkgJson.peerDependencies)) {
+                    if (!peerDeps[peerDepName]) {
+                        peerDeps[peerDepName] = {
+                            versions: [],
+                            requiredBy: [],
+                        };
+                    }
+                    const versionStr = peerDepVersion;
+                    if (!peerDeps[peerDepName].versions.includes(versionStr)) {
+                        peerDeps[peerDepName].versions.push(versionStr);
+                    }
+                    if (!peerDeps[peerDepName].requiredBy.includes(packageName)) {
+                        peerDeps[peerDepName].requiredBy.push(packageName);
+                    }
+                    // Add peer dependency to queue for processing
+                    if (!visited.has(peerDepName)) {
+                        queue.push(peerDepName);
+                    }
+                }
+            }
+            // Collect dependencies and devDependencies to continue traversal
+            const allDeps = {
+                ...pkgJson.dependencies,
+                ...pkgJson.devDependencies,
+            };
+            for (const depName of Object.keys(allDeps)) {
+                if (!visited.has(depName)) {
+                    queue.push(depName);
+                }
+            }
         }
-        if (!peerDeps[peerDepName].requiredBy.includes(depName)) {
-          peerDeps[peerDepName].requiredBy.push(depName);
+        catch (error) {
+            console.warn(`Warning: Could not read package.json for ${packageName}`);
         }
-      }
-    }
-    // Recursively check nested dependencies
-    if (depInfo.dependencies) {
-      collectPeerDependencies(depInfo.dependencies, peerDeps, depName);
     }
-  }
-  return peerDeps;
+    return peerDeps;
 }
 function resolveVersion(versions) {
-  if (versions.length === 0) {
-    return { version: "*", isConflict: false };
-  }
-  if (versions.length === 1) {
-    return { version: versions[0], isConflict: false };
-  }
-  // Try to find a compatible version
-  // For simplicity, if all versions are the same, use that
-  const uniqueVersions = [...new Set(versions)];
-  if (uniqueVersions.length === 1) {
-    return { version: uniqueVersions[0], isConflict: false };
-  }
-  // Check if all are compatible (simple heuristic: same major version for ^)
-  const allCompatible = uniqueVersions.every((v) => {
-    const baseVersion = uniqueVersions[0];
-    // If both start with ^, check major version
-    if (v.startsWith("^") && baseVersion.startsWith("^")) {
-      const vMajor = v.substring(1).split(".")[0];
-      const baseMajor = baseVersion.substring(1).split(".")[0];
-      return vMajor === baseMajor;
+    if (versions.length === 0) {
+        return { version: "*", isConflict: false };
+    }
+    if (versions.length === 1) {
+        return { version: versions[0], isConflict: false };
+    }
+    // Get unique versions
+    const uniqueVersions = [...new Set(versions)];
+    if (uniqueVersions.length === 1) {
+        return { version: uniqueVersions[0], isConflict: false };
+    }
+    // Use semver to find intersecting range
+    try {
+        // Try to find a version range that satisfies all requirements
+        let intersection = uniqueVersions[0];
+        for (let i = 1; i < uniqueVersions.length; i++) {
+            const range1 = intersection;
+            const range2 = uniqueVersions[i];
+            // Check if ranges intersect
+            if (semver.intersects(range1, range2)) {
+                // Find the more restrictive range
+                // Use the one with higher minimum version
+                const min1 = semver.minVersion(range1);
+                const min2 = semver.minVersion(range2);
+                if (min1 && min2) {
+                    intersection = semver.gt(min1, min2) ? range1 : range2;
+                }
+                else {
+                    intersection = range1;
+                }
+            }
+            else {
+                // Ranges don't intersect - conflict detected
+                return { version: uniqueVersions.join(" | "), isConflict: true };
+            }
+        }
+        return { version: intersection, isConflict: false };
+    }
+    catch (error) {
+        // If semver parsing fails, fall back to showing all versions
+        return { version: uniqueVersions.join(" | "), isConflict: true };
     }
-    // If both are exact versions, they must match
-    return v === baseVersion;
-  });
-  if (allCompatible && uniqueVersions[0].startsWith("^")) {
-    // Return the highest version requirement
-    const sorted = [...uniqueVersions].sort((a, b) => {
-      const aVer = a.substring(1);
-      const bVer = b.substring(1);
-      return bVer.localeCompare(aVer, undefined, { numeric: true });
-    });
-    return { version: sorted[0], isConflict: false };
-  }
-  // Conflict detected
-  return { version: uniqueVersions.join(" | "), isConflict: true };
 }
 function getPeerDepsTemplate() {
-  return `
+    return `
 <html>
   <head>
     <title>{{projectName}} - Peer Dependencies</title>
@@ -470,6 +456,18 @@ function getPeerDepsTemplate() {
         font-weight: 600;
       }
       
+      .installed-by-dep-badge {
+        display: flex;
+        align-items: center;
+        gap: 0.5rem;
+        padding: 0.5rem 1rem;
+        background: #e0e7ff;
+        color: #3730a3;
+        border-radius: 6px;
+        font-size: 0.875rem;
+        font-weight: 600;
+      }
+      
       .checkmark {
         color: #10b981;
         font-size: 1.25rem;
@@ -527,15 +525,21 @@ function getPeerDepsTemplate() {
             <div class="action-container">
               {{#isInstalled}}
               <div class="installed-badge">
-                <span class="checkmark">✓</span>
                 Installed
               </div>
               {{/isInstalled}}
+              {{#isInstalledByDependency}}
+              <div class="installed-by-dep-badge">
+                Installed by dependency
+              </div>
+              {{/isInstalledByDependency}}
               {{^isInstalled}}
+              {{^isInstalledByDependency}}
               <button class="install-btn" onclick="installPackage('{{name}}', '{{version}}', this)">
                 npm install
               </button>
               <div class="message" id="msg-{{name}}"></div>
+              {{/isInstalledByDependency}}
               {{/isInstalled}}
             </div>
           </div>
@@ -600,7 +604,7 @@ function getPeerDepsTemplate() {
 `;
 }
 function getTemplate() {
-  return `
+    return `
 <html>
   <head>
     <title>{{name}}'s Dependency Graph</title>
@@ -611,8 +615,8 @@ function getTemplate() {
             var nodes = graph.nodes();
             var edges = graph.edges();
             
-            // Physics constants
-            var repulsionStrength = 100;
+            // Physics constants - lower repulsion for better spacing
+            var repulsionStrength = 50;
             var attractionStrength = 0.01;
             var damping = 0.5;
             

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "easy-dep-graph",
-  "version": "1.1.1",
+  "version": "1.1.3",
   "description": "Easily see the dependency graph of your npm project",
   "homepage": "https://github.com/danisss9/easy-dep-graph#readme",
   "repository": {
@@ -54,11 +54,13 @@
     "fastify": "^5.7.4",
     "mustache": "^4.2.0",
     "open": "^11.0.0",
+    "semver": "^7.7.3",
     "shelljs": "^0.10.0"
   },
   "devDependencies": {
     "@types/mustache": "^4.2.6",
     "@types/node": "^25.2.1",
+    "@types/semver": "^7.7.1",
     "@types/shelljs": "^0.10.0",
     "typescript": "^5.9.3"
   }