@anxin233/gitviz 1.0.1 → 1.0.4

package/package.json

@@ -1,10 +1,10 @@
 {
   "name": "@anxin233/gitviz",
-  "version": "1.0.1",
+  "version": "1.0.4",
   "description": "🎨 Beautiful, interactive Git repository visualizations - Transform your Git history into stunning visual stories",
   "type": "module",
   "bin": {
-    "gitviz": "./dist/cli.js"
+    "gitviz": "./dist/cli.cjs"
   },
   "scripts": {
     "dev": "node --loader ts-node/esm src/cli/index.ts",

package/scripts/build-esbuild.js

@@ -13,13 +13,9 @@ build({
   bundle: true,
   platform: 'node',
   target: 'node18',
-  format: 'esm',
-  outfile: join(rootDir, 'dist', 'cli.js'),
-  banner: {
-    js: '#!/usr/bin/env node'
-  },
+  format: 'cjs',
+  outfile: join(rootDir, 'dist', 'cli.cjs'),
   external: [
-    // 不打包这些 node 内置模块
     'fs',
     'path',
     'url',
@@ -30,12 +26,22 @@ build({
     'os',
     'crypto'
   ],
-  minify: false, // 保持可读性，方便调试
+  minify: false,
   sourcemap: false,
   logLevel: 'info'
 }).then(() => {
+  // 读取生成的文件
+  const outputPath = join(rootDir, 'dist', 'cli.cjs');
+  let content = readFileSync(outputPath, 'utf-8');
+
+  // 检查是否已有 shebang，如果没有才添加
+  if (!content.startsWith('#!/usr/bin/env node')) {
+    content = '#!/usr/bin/env node\n' + content;
+    writeFileSync(outputPath, content, 'utf-8');
+  }
+
   console.log('✅ Build successful!');
-  console.log('📁 Output: dist/cli.js');
+  console.log('📁 Output: dist/cli.cjs');
 }).catch((error) => {
   console.error('❌ Build failed:', error);
   process.exit(1);

package/dist/cli/index.js

@@ -1,67 +0,0 @@
-#!/usr/bin/env node
-import { Command } from 'commander';
-import chalk from 'chalk';
-import ora from 'ora';
-import { writeFileSync } from 'fs';
-import { join } from 'path';
-import { GitParser } from '../core/git-parser.js';
-import { Analyzer } from '../core/analyzer.js';
-import { generateHTML } from '../visualizers/html-generator.js';
-const program = new Command();
-program
-    .name('gitviz')
-    .description('🎨 Beautiful, interactive Git repository visualizations')
-    .version('1.0.0');
-program
-    .command('analyze')
-    .description('Analyze a Git repository and generate visualizations')
-    .option('-p, --path <path>', 'Path to Git repository', '.')
-    .option('-o, --output <file>', 'Output HTML file', 'gitviz-report.html')
-    .option('-l, --limit <number>', 'Limit number of commits to analyze', '1000')
-    .action(async (options) => {
-    const spinner = ora('Initializing GitViz...').start();
-    try {
-        const parser = new GitParser(options.path);
-        spinner.text = 'Checking if directory is a Git repository...';
-        const isRepo = await parser.isGitRepository();
-        if (!isRepo) {
-            spinner.fail(chalk.red('Error: Not a Git repository'));
-            process.exit(1);
-        }
-        spinner.text = 'Parsing Git commits...';
-        const commits = await parser.parseCommits(parseInt(options.limit));
-        if (commits.length === 0) {
-            spinner.fail(chalk.red('Error: No commits found'));
-            process.exit(1);
-        }
-        spinner.text = `Analyzing ${commits.length} commits...`;
-        const analyzer = new Analyzer();
-        const analysis = analyzer.analyze(commits);
-        spinner.text = 'Generating visualization data...';
-        const vizData = analyzer.generateVisualizationData(analysis);
-        spinner.text = 'Creating HTML report...';
-        const repoName = options.path === '.' ? 'Current Repository' : options.path;
-        const html = generateHTML(vizData, repoName);
-        const outputPath = join(process.cwd(), options.output);
-        writeFileSync(outputPath, html, 'utf-8');
-        spinner.succeed(chalk.green('✨ Visualization generated successfully!'));
-        console.log('\n' + chalk.bold('📊 Repository Statistics:'));
-        console.log(chalk.cyan(`  Total Commits: ${analysis.totalCommits}`));
-        console.log(chalk.cyan(`  Contributors: ${analysis.totalContributors}`));
-        console.log(chalk.cyan(`  Files Changed: ${analysis.files.size}`));
-        console.log(chalk.cyan(`  Date Range: ${analysis.dateRange.start.toLocaleDateString()} - ${analysis.dateRange.end.toLocaleDateString()}`));
-        console.log('\n' + chalk.bold(`📁 Output: ${outputPath}`));
-        console.log(chalk.gray(`\nOpen the file in your browser to view the interactive visualization.\n`));
-    }
-    catch (error) {
-        spinner.fail(chalk.red('Error: ' + error.message));
-        process.exit(1);
-    }
-});
-program
-    .command('quick')
-    .description('Quick analysis of current directory')
-    .action(async () => {
-    program.parse(['node', 'gitviz', 'analyze']);
-});
-program.parse();

package/dist/core/analyzer.js

@@ -1,99 +0,0 @@
-export class Analyzer {
-    analyze(commits) {
-        const contributors = new Map();
-        const files = new Map();
-        for (const commit of commits) {
-            const key = commit.email || commit.author;
-            if (!contributors.has(key)) {
-                contributors.set(key, {
-                    name: commit.author,
-                    email: commit.email,
-                    commits: 0,
-                    insertions: 0,
-                    deletions: 0,
-                    firstCommit: commit.date,
-                    lastCommit: commit.date
-                });
-            }
-            const contributor = contributors.get(key);
-            contributor.commits++;
-            contributor.insertions += commit.insertions;
-            contributor.deletions += commit.deletions;
-            contributor.lastCommit = commit.date;
-            for (const file of commit.files) {
-                if (!files.has(file)) {
-                    files.set(file, {
-                        path: file,
-                        changes: 0,
-                        lastModified: commit.date,
-                        contributors: new Set()
-                    });
-                }
-                const fileChange = files.get(file);
-                fileChange.changes++;
-                fileChange.lastModified = commit.date;
-                fileChange.contributors.add(commit.author);
-            }
-        }
-        const dates = commits.map(c => c.date);
-        return {
-            commits,
-            contributors,
-            files,
-            totalCommits: commits.length,
-            totalContributors: contributors.size,
-            dateRange: {
-                start: new Date(Math.min(...dates.map(d => d.getTime()))),
-                end: new Date(Math.max(...dates.map(d => d.getTime())))
-            }
-        };
-    }
-    generateVisualizationData(analysis) {
-        return {
-            timeline: this.generateTimelineData(analysis.commits),
-            contributors: this.generateContributorData(analysis.contributors),
-            heatmap: this.generateHeatmapData(analysis.files)
-        };
-    }
-    generateTimelineData(commits) {
-        const dailyStats = new Map();
-        for (const commit of commits) {
-            const dateKey = commit.date.toISOString().split('T')[0];
-            if (!dailyStats.has(dateKey)) {
-                dailyStats.set(dateKey, { commits: 0, insertions: 0, deletions: 0 });
-            }
-            const stats = dailyStats.get(dateKey);
-            stats.commits++;
-            stats.insertions += commit.insertions;
-            stats.deletions += commit.deletions;
-        }
-        return Array.from(dailyStats.entries())
-            .map(([date, stats]) => ({
-            date,
-            ...stats
-        }))
-            .sort((a, b) => a.date.localeCompare(b.date));
-    }
-    generateContributorData(contributors) {
-        return Array.from(contributors.values())
-            .map(c => ({
-            name: c.name,
-            commits: c.commits,
-            lines: c.insertions + c.deletions
-        }))
-            .sort((a, b) => b.commits - a.commits)
-            .slice(0, 20);
-    }
-    generateHeatmapData(files) {
-        const fileArray = Array.from(files.values());
-        const maxChanges = Math.max(...fileArray.map(f => f.changes));
-        return fileArray
-            .map(f => ({
-            file: f.path,
-            changes: f.changes,
-            heat: f.changes / maxChanges
-        }))
-            .sort((a, b) => b.changes - a.changes)
-            .slice(0, 50);
-    }
-}

package/dist/core/git-parser.js

@@ -1,53 +0,0 @@
-import simpleGit from 'simple-git';
-export class GitParser {
-    git;
-    repoPath;
-    constructor(repoPath = '.') {
-        this.repoPath = repoPath;
-        this.git = simpleGit(repoPath);
-    }
-    async isGitRepository() {
-        try {
-            await this.git.status();
-            return true;
-        }
-        catch {
-            return false;
-        }
-    }
-    async parseCommits(limit = 1000) {
-        const log = await this.git.log({
-            maxCount: limit,
-            '--numstat': null,
-            '--pretty': 'format:%H|%an|%ae|%ai|%s'
-        });
-        const commits = [];
-        for (const commit of log.all) {
-            const diffSummary = await this.git.diffSummary([`${commit.hash}^`, commit.hash]);
-            commits.push({
-                hash: commit.hash,
-                author: commit.author_name || 'Unknown',
-                email: commit.author_email || '',
-                date: new Date(commit.date),
-                message: commit.message,
-                files: diffSummary.files.map(f => f.file),
-                insertions: diffSummary.insertions,
-                deletions: diffSummary.deletions
-            });
-        }
-        return commits;
-    }
-    async getBranchName() {
-        const branch = await this.git.branch();
-        return branch.current;
-    }
-    async getRemoteUrl() {
-        try {
-            const remotes = await this.git.getRemotes(true);
-            return remotes[0]?.refs?.fetch || null;
-        }
-        catch {
-            return null;
-        }
-    }
-}

package/dist/core/types.js

@@ -1 +0,0 @@
-export {};

package/dist/visualizers/html-generator.js

@@ -1,292 +0,0 @@
-export function generateHTML(data, repoName) {
-    return `<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>GitViz - ${repoName}</title>
-  <script src="https://d3js.org/d3.v7.min.js"></script>
-  <style>
-    * { margin: 0; padding: 0; box-sizing: border-box; }
-    body {
-      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
-      background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-      color: #333;
-      padding: 2rem;
-    }
-    .container {
-      max-width: 1400px;
-      margin: 0 auto;
-      background: white;
-      border-radius: 20px;
-      padding: 3rem;
-      box-shadow: 0 20px 60px rgba(0,0,0,0.3);
-    }
-    h1 {
-      font-size: 3rem;
-      margin-bottom: 0.5rem;
-      background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-      -webkit-background-clip: text;
-      -webkit-text-fill-color: transparent;
-      background-clip: text;
-    }
-    .subtitle {
-      color: #666;
-      font-size: 1.2rem;
-      margin-bottom: 3rem;
-    }
-    .section {
-      margin-bottom: 4rem;
-    }
-    .section h2 {
-      font-size: 1.8rem;
-      margin-bottom: 1.5rem;
-      color: #333;
-    }
-    .chart {
-      background: #f8f9fa;
-      border-radius: 12px;
-      padding: 2rem;
-    }
-    .bar { fill: #667eea; transition: fill 0.3s; }
-    .bar:hover { fill: #764ba2; }
-    .axis { font-size: 12px; }
-    .axis path, .axis line { stroke: #ddd; }
-    .tooltip {
-      position: absolute;
-      background: rgba(0,0,0,0.8);
-      color: white;
-      padding: 8px 12px;
-      border-radius: 6px;
-      font-size: 14px;
-      pointer-events: none;
-      opacity: 0;
-      transition: opacity 0.3s;
-    }
-    .stats {
-      display: grid;
-      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
-      gap: 1.5rem;
-      margin-bottom: 3rem;
-    }
-    .stat-card {
-      background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-      color: white;
-      padding: 1.5rem;
-      border-radius: 12px;
-      text-align: center;
-    }
-    .stat-value {
-      font-size: 2.5rem;
-      font-weight: bold;
-      margin-bottom: 0.5rem;
-    }
-    .stat-label {
-      font-size: 1rem;
-      opacity: 0.9;
-    }
-  </style>
-</head>
-<body>
-  <div class="container">
-    <h1>📊 GitViz</h1>
-    <p class="subtitle">Repository: ${repoName}</p>
-
-    <div class="stats">
-      <div class="stat-card">
-        <div class="stat-value">${data.timeline.reduce((sum, d) => sum + d.commits, 0)}</div>
-        <div class="stat-label">Total Commits</div>
-      </div>
-      <div class="stat-card">
-        <div class="stat-value">${data.contributors.length}</div>
-        <div class="stat-label">Contributors</div>
-      </div>
-      <div class="stat-card">
-        <div class="stat-value">${data.heatmap.length}</div>
-        <div class="stat-label">Files Changed</div>
-      </div>
-    </div>
-
-    <div class="section">
-      <h2>📈 Commit Timeline</h2>
-      <div class="chart" id="timeline"></div>
-    </div>
-
-    <div class="section">
-      <h2>👥 Top Contributors</h2>
-      <div class="chart" id="contributors"></div>
-    </div>
-
-    <div class="section">
-      <h2>🔥 File Change Heatmap</h2>
-      <div class="chart" id="heatmap"></div>
-    </div>
-  </div>
-
-  <div class="tooltip" id="tooltip"></div>
-
-  <script>
-    const data = ${JSON.stringify(data)};
-
-    // Timeline Chart
-    {
-      const margin = {top: 20, right: 30, bottom: 40, left: 50};
-      const width = 1200 - margin.left - margin.right;
-      const height = 300 - margin.top - margin.bottom;
-
-      const svg = d3.select("#timeline")
-        .append("svg")
-        .attr("width", width + margin.left + margin.right)
-        .attr("height", height + margin.top + margin.bottom)
-        .append("g")
-        .attr("transform", \`translate(\${margin.left},\${margin.top})\`);
-
-      const x = d3.scaleBand()
-        .domain(data.timeline.map(d => d.date))
-        .range([0, width])
-        .padding(0.1);
-
-      const y = d3.scaleLinear()
-        .domain([0, d3.max(data.timeline, d => d.commits)])
-        .range([height, 0]);
-
-      svg.append("g")
-        .attr("class", "axis")
-        .attr("transform", \`translate(0,\${height})\`)
-        .call(d3.axisBottom(x).tickValues(x.domain().filter((d, i) => i % Math.ceil(data.timeline.length / 10) === 0)));
-
-      svg.append("g")
-        .attr("class", "axis")
-        .call(d3.axisLeft(y));
-
-      svg.selectAll(".bar")
-        .data(data.timeline)
-        .enter()
-        .append("rect")
-        .attr("class", "bar")
-        .attr("x", d => x(d.date))
-        .attr("y", d => y(d.commits))
-        .attr("width", x.bandwidth())
-        .attr("height", d => height - y(d.commits))
-        .on("mouseover", function(event, d) {
-          d3.select("#tooltip")
-            .style("opacity", 1)
-            .html(\`<strong>\${d.date}</strong><br/>Commits: \${d.commits}<br/>+\${d.insertions} -\${d.deletions}\`)
-            .style("left", (event.pageX + 10) + "px")
-            .style("top", (event.pageY - 10) + "px");
-        })
-        .on("mouseout", function() {
-          d3.select("#tooltip").style("opacity", 0);
-        });
-    }
-
-    // Contributors Chart
-    {
-      const margin = {top: 20, right: 30, bottom: 100, left: 50};
-      const width = 1200 - margin.left - margin.right;
-      const height = 400 - margin.top - margin.bottom;
-
-      const svg = d3.select("#contributors")
-        .append("svg")
-        .attr("width", width + margin.left + margin.right)
-        .attr("height", height + margin.top + margin.bottom)
-        .append("g")
-        .attr("transform", \`translate(\${margin.left},\${margin.top})\`);
-
-      const x = d3.scaleBand()
-        .domain(data.contributors.map(d => d.name))
-        .range([0, width])
-        .padding(0.2);
-
-      const y = d3.scaleLinear()
-        .domain([0, d3.max(data.contributors, d => d.commits)])
-        .range([height, 0]);
-
-      svg.append("g")
-        .attr("class", "axis")
-        .attr("transform", \`translate(0,\${height})\`)
-        .call(d3.axisBottom(x))
-        .selectAll("text")
-        .attr("transform", "rotate(-45)")
-        .style("text-anchor", "end");
-
-      svg.append("g")
-        .attr("class", "axis")
-        .call(d3.axisLeft(y));
-
-      svg.selectAll(".bar")
-        .data(data.contributors)
-        .enter()
-        .append("rect")
-        .attr("class", "bar")
-        .attr("x", d => x(d.name))
-        .attr("y", d => y(d.commits))
-        .attr("width", x.bandwidth())
-        .attr("height", d => height - y(d.commits))
-        .on("mouseover", function(event, d) {
-          d3.select("#tooltip")
-            .style("opacity", 1)
-            .html(\`<strong>\${d.name}</strong><br/>Commits: \${d.commits}<br/>Lines: \${d.lines}\`)
-            .style("left", (event.pageX + 10) + "px")
-            .style("top", (event.pageY - 10) + "px");
-        })
-        .on("mouseout", function() {
-          d3.select("#tooltip").style("opacity", 0);
-        });
-    }
-
-    // Heatmap
-    {
-      const margin = {top: 20, right: 30, bottom: 20, left: 300};
-      const width = 1200 - margin.left - margin.right;
-      const height = Math.min(800, data.heatmap.length * 20);
-
-      const svg = d3.select("#heatmap")
-        .append("svg")
-        .attr("width", width + margin.left + margin.right)
-        .attr("height", height + margin.top + margin.bottom)
-        .append("g")
-        .attr("transform", \`translate(\${margin.left},\${margin.top})\`);
-
-      const y = d3.scaleBand()
-        .domain(data.heatmap.map(d => d.file))
-        .range([0, height])
-        .padding(0.1);
-
-      const colorScale = d3.scaleSequential(d3.interpolateReds)
-        .domain([0, 1]);
-
-      svg.selectAll("rect")
-        .data(data.heatmap)
-        .enter()
-        .append("rect")
-        .attr("y", d => y(d.file))
-        .attr("width", width)
-        .attr("height", y.bandwidth())
-        .attr("fill", d => colorScale(d.heat))
-        .on("mouseover", function(event, d) {
-          d3.select("#tooltip")
-            .style("opacity", 1)
-            .html(\`<strong>\${d.file}</strong><br/>Changes: \${d.changes}\`)
-            .style("left", (event.pageX + 10) + "px")
-            .style("top", (event.pageY - 10) + "px");
-        })
-        .on("mouseout", function() {
-          d3.select("#tooltip").style("opacity", 0);
-        });
-
-      svg.selectAll("text")
-        .data(data.heatmap)
-        .enter()
-        .append("text")
-        .attr("x", -10)
-        .attr("y", d => y(d.file) + y.bandwidth() / 2)
-        .attr("dy", "0.35em")
-        .attr("text-anchor", "end")
-        .attr("font-size", "12px")
-        .text(d => d.file);
-    }
-  </script>
-</body>
-</html>`;
-}