### VibeAlive Development Setup Commands

Source: https://github.com/skullzarmy/vibealive/blob/main/CONTRIBUTING.md

Commands to clone the VibeAlive repository, install dependencies, build the project, run tests, and perform linting. Assumes Node.js and npm are installed.

```bash
git clone https://github.com/your-username/vibealive.git
cd vibealive
npm install
npm run build
npm test
npm run lint
npm run format:check
```

--------------------------------

### Programmatic VibeAlive MCP Client Integration

Source: https://github.com/skullzarmy/vibealive/blob/main/examples/README.md

Demonstrates how to integrate with the VibeAlive Message Communication Protocol (MCP) server programmatically using TypeScript. This example covers SDK-based client setup, job management (starting, monitoring, retrieving results), and includes error handling and type safety for robust integration.

```typescript
// TypeScript example showing how to integrate with the MCP server programmatically:
// - SDK-based client setup
// - Job management (start, monitor, retrieve results)
// - Error handling and type safety
// - Multiple analysis types
```

--------------------------------

### Analyze Package Configuration with CLI

Source: https://context7.com/skullzarmy/vibealive/llms.txt

This CLI command inspects the project's ecosystem for installed and configured packages, specifically checking for common Next.js-related libraries like next-themes, tailwindcss, next-seo, and @vercel/analytics. It outputs the installation status and configuration state (configured, missing, or not installed) for each package, with an option to format the output as JSON.

```bash
npx vibealive packages . --format json

# Expected Output:
# 📦 Analyzing package configuration...
# Packages analyzed:
# • next-themes: installed, configured ✓
# • tailwindcss: installed, missing postcss.config.js ⚠
# • next-seo: not installed
# • @vercel/analytics: installed, not configured ⚠
# 📦 Package analysis completed in 234 ms
```

--------------------------------

### Direct VibeAlive Analyzer Usage

Source: https://github.com/skullzarmy/vibealive/blob/main/examples/README.md

Shows how to use the VibeAlive analyzer directly, bypassing the MCP layer. This approach is useful for custom tools and scripts where direct control over configuration, analysis execution, and result processing is needed. It covers configuration setup, running analysis, and processing results.

```typescript
// Direct analyzer usage without MCP layer:
// - Configuration setup
// - Running analysis programmatically
// - Processing results
// - Integration into custom tools
```

--------------------------------

### Install and Analyze Next.js Project with Vibealive CLI

Source: https://github.com/skullzarmy/vibealive/blob/main/README.md

This snippet shows how to install and use the Vibealive CLI to analyze a Next.js project. It demonstrates direct execution with npx and global installation via npm. The analysis command takes the project path as an argument.

```bash
npx vibealive analyze <project-path>
```

```bash
npm install -g vibealive
vibealive analyze <project-path>
```

--------------------------------

### Run VibeAlive CLI Serve Command

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/cli.md

Starts the MCP server for programmatic access. It supports custom HTTP ports and stdio transport for direct integration with MCP clients.

```bash
npx vibealive serve [options]

# Example:
npx vibealive serve --stdio
npx vibealive serve --port 3000
```

--------------------------------

### Package.json Scripts for VibeAlive Bundle Analysis

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/bundle-analysis.md

Example `package.json` scripts to automate the build and bundle analysis process using VibeAlive. Includes scripts for building, analyzing bundles, and running analysis standalone.

```json
{
  "scripts": {
    "build": "next build",
    "build:analyze": "ANALYZE_BUNDLE=true npm run build && npx vibealive bundle-scan .",
    "analyze:bundle": "npx vibealive bundle-scan ."
  }
}
```

--------------------------------

### Start MCP Server via HTTP (Bash)

Source: https://context7.com/skullzarmy/vibealive/llms.txt

Starts the VibeAlive MCP server using HTTP transport. The server can be started on the default port or a custom port using the --port flag. It provides endpoints for modern and legacy communication.

```bash
# Start HTTP server on default port
npx vibealive serve

# Start on custom port
npx vibealive serve --port 3000

# Expected output:
# 🚀 Starting MCP HTTP Server with v2025-03-26 standards...
# ✅ MCP Server running on http://localhost:8080
# 🔗 Modern endpoint: http://localhost:8080/mcp
# 🔗 Legacy endpoint: http://localhost:8080/sse
```

--------------------------------

### Start Vibealive MCP Server for IDE Integration

Source: https://github.com/skullzarmy/vibealive/blob/main/README.md

This command starts the Model Context Protocol (MCP) server provided by Vibealive. This server enables IDE integration and other tool support, facilitating features like real-time code analysis and suggestions within your development environment.

```bash
# Start MCP server for IDE integration
npx vibealive serve --stdio
```

--------------------------------

### VibeAlive Commit Examples

Source: https://github.com/skullzarmy/vibealive/blob/main/CONTRIBUTING.md

Examples of Git commit messages following the conventional commit format, demonstrating feature, fix, and documentation changes.

```git
git commit -m "feat(analyzer): add support for App Router patterns"
git commit -m "fix(mcp): resolve server startup race condition"
git commit -m "docs(examples): add Azure DevOps pipeline configuration"
```

--------------------------------

### IDE Setup for MCP

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/index.md

Configures the VibeAlive MCP server for IDE integration, specifically for VS Code. This involves creating a JSON configuration file with stdio settings to enable communication between the IDE and the analysis tool.

```json
{
  "stdio": true
}
```

--------------------------------

### Start VibeAlive MCP Server with Stdio Transport

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/mcp.md

Command to start the VibeAlive MCP server using stdio transport, recommended for direct CLI integration. This command invokes the vibealive serve executable with the --stdio flag.

```bash
npx vibealive serve --stdio
```

--------------------------------

### Define npm Scripts for VibeAlive Analysis

Source: https://github.com/skullzarmy/vibealive/blob/main/examples/README.md

Provides a set of npm scripts for common VibeAlive analysis tasks. These scripts allow for easy execution of different analysis modes, including CI-friendly modes with issue fail conditions and specific scans for themes, SEO, performance, and accessibility.

```json
{
  "scripts": {
    "analyze": "vibealive analyze .",
    "analyze:ci": "vibealive analyze . --ci --fail-on-issues --max-issues 5",
    "analyze:strict": "vibealive analyze . --ci --fail-on-issues --max-issues 0 --confidence-threshold 95",
    "scan:theme": "vibealive theme-scan .",
    "scan:seo": "vibealive seo-scan .",
    "scan:perf": "vibealive perf-scan .",
    "scan:a11y": "vibealive a11y-scan .",
    "health": "vibealive health ."
  }
}
```

--------------------------------

### Install VibeAlive Webpack Plugin

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/webpack-plugin.md

This snippet shows how to import the VibeAliveWebpackPlugin from the main vibealive package. It's the first step before configuring the plugin in your webpack setup.

```javascript
const { VibeAliveWebpackPlugin } = require('vibealive/webpack');
```

--------------------------------

### Start MCP Server via Stdio (Bash)

Source: https://context7.com/skullzarmy/vibealive/llms.txt

Starts the VibeAlive MCP (Modern Code Protocol) server using stdio transport. This mode is typically used for IDE integration, where communication occurs over standard input and output. No direct console output is expected as stdio is reserved for the protocol.

```bash
# Start server with stdio transport for IDE integration
npx vibealive serve --stdio

# Server starts and communicates via stdin/stdout
# No console output (stdio is reserved for MCP protocol)
```

--------------------------------

### Configure VS Code MCP Server for VibeAlive

Source: https://github.com/skullzarmy/vibealive/blob/main/examples/README.md

Sets up the VS Code Message Communication Protocol (MCP) server to connect with VibeAlive. This configuration uses the standard 'stdio' type to communicate with the VibeAlive CLI, enabling VibeAlive features directly within the VS Code editor.

```json
{
  "servers": {
    "vibealive": {
      "type": "stdio",
      "command": "npx",
      "args": ["vibealive", "serve", "--stdio"]
    }
  }
}
```

--------------------------------

### VibeAlive CLI Commands for CI/CD

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/build-integration.md

Examples of using the VibeAlive CLI for Continuous Integration and Continuous Deployment. These commands demonstrate different levels of strictness for code analysis, including CI mode, failing on issues, setting maximum issue counts, and adjusting confidence thresholds.

```bash
# Basic CI check
npx vibealive analyze . --ci --fail-on-issues --max-issues 5

# Strict production check (zero tolerance)
npx vibealive analyze . --ci --fail-on-issues --max-issues 0 --confidence-threshold 95

# Permissive development check
npx vibealive analyze . --max-issues 20 --confidence-threshold 70

# Silent mode for automated builds
npx vibealive analyze . --ci --silent --fail-on-issues --max-issues 10
```

--------------------------------

### Build and Test VibeAlive Translation

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/i18n.md

Provides commands for building the VibeAlive project after adding or modifying translation files and for testing the implemented translations. It includes steps for building the project, running CLI analysis with a specific locale, and verifying the generated report.

```bash
# Build the project
npm run build

# Test CLI commands with your locale
node dist/cli.js analyze . --locale your_locale

# Verify reports are generated correctly
# Check generated markdown report
cat .vibealive/analysis-results/analysis-report-*.md
```

--------------------------------

### Start VibeAlive MCP Server with HTTP Transport

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/mcp.md

Command to start the VibeAlive MCP server using HTTP transport on a specified port, suitable for web-based clients and remote access. The server will be accessible at http://localhost:8080/mcp.

```bash
npx vibealive serve --port 8080
```

--------------------------------

### MCP Client Integration: Focused Analysis Tools

Source: https://context7.com/skullzarmy/vibealive/llms.txt

Demonstrates the use of the MCP client for specialized analysis tasks including theme setup analysis, SEO audit, performance issue scanning, and accessibility checking. Each tool takes the project path as an argument and provides specific insights into the project's quality.

```typescript
// Theme analysis
const themeResult = await client.callTool({
  name: 'analyze-theme-setup',
  arguments: {
    projectPath: '/path/to/project',
  },
});

// SEO audit
const seoResult = await client.callTool({
  name: 'audit-seo-setup',
  arguments: {
    projectPath: '/path/to/project',
  },
});

// Performance scan
const perfResult = await client.callTool({
  name: 'scan-performance-issues',
  arguments: {
    projectPath: '/path/to/project',
  },
});

// Accessibility check
const a11yResult = await client.callTool({
  name: 'check-accessibility',
  arguments: {
    projectPath: '/path/to/project',
  },
});

console.log(a11yResult.content[0].text);
```

--------------------------------

### Basic Build Integration with npm scripts

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/build-integration.md

Integrate VibeAlive analysis into your npm scripts for automated checks during the build process. This setup includes a basic analysis script and a CI-optimized script that fails on issues.

```json
{
  "scripts": {
    "analyze": "vibealive analyze .",
    "analyze:ci": "vibealive analyze . --ci --fail-on-issues --max-issues 5",
    "prebuild": "npm run analyze:ci"
  }
}
```

--------------------------------

### GitHub Actions CI/CD Workflow for VibeAlive

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/build-integration.md

A GitHub Actions workflow that checks out the code, sets up Node.js, installs dependencies, runs VibeAlive analysis, and uploads the reports as an artifact. This workflow is triggered on push and pull request events.

```yaml
name: Code Analysis
on: [push, pull_request]

jobs:
  analyze:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: '18'
      - run: npm ci
      - run: npx vibealive analyze . --ci --fail-on-issues --max-issues 5
      - uses: actions/upload-artifact@v4
        if: always()
        with:
          name: vibealive-reports
          path: ./vibealive-reports/
```

--------------------------------

### Variable Interpolation in JSON Translations - VibeAlive

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/i18n.md

Highlights how to handle variable interpolation within VibeAlive's translation files. Variables are denoted by `{{variableName}}`. This example shows the English source string and its Spanish translation, demonstrating how to translate text while preserving the variable syntax.

```json
// English
"totalFiles": "- **Total Files Analyzed**: {{count}}"

// Spanish  
"totalFiles": "- **Archivos Analizados**: {{count}}"
```

--------------------------------

### MCP Standard Error Response Example

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/mcp.md

Example of a standard JSON-RPC error response from the MCP server. This structure is used to communicate errors, including invalid parameters, back to the client.

```json
{
  "jsonrpc": "2.0",
  "error": {
    "code": -32602,
    "message": "Invalid parameters",
    "data": { "details": "Missing required parameter: projectPath" }
  },
  "id": null
}
```

--------------------------------

### TypeScript Client Integration with Stdio Transport

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/mcp.md

Example demonstrating how to integrate with the VibeAlive MCP server using the official MCP SDK in TypeScript. It connects via stdio transport, initiates a project analysis, and checks the job status.

```typescript
import { Client } from '@modelcontextprotocol/sdk/client/index.js';
import { StdioClientTransport } from '@modelcontextprotocol/sdk/client/stdio.js';

const client = new Client({
  name: 'my-client',
  version: '1.0.0',
});

const transport = new StdioClientTransport({
  command: 'npx',
  args: ['vibealive', 'serve', '--stdio'],
});

await client.connect(transport);

// Start analysis
const result = await client.callTool({
  name: 'analyze-project',
  arguments: { projectPath: '/my/project' },
});

// Check status
const status = await client.callTool({
  name: 'get-job-status',
  arguments: { jobId: result.jobId },
});
```

--------------------------------

### Configure Next.js with VibeAlive Webpack Plugin

Source: https://github.com/skullzarmy/vibealive/blob/main/examples/README.md

Integrates the VibeAliveWebpackPlugin into a Next.js project's webpack configuration. This plugin can be used to perform analysis during the build process, with options to fail on errors and set maximum issues, particularly useful for production builds.

```javascript
const { VibeAliveWebpackPlugin } = require('vibealive/webpack');

module.exports = {
  webpack: (config, { dev, isServer }) => {
    if (!dev && !isServer) {
      config.plugins.push(
        new VibeAliveWebpackPlugin({
          failOnError: process.env.NODE_ENV === 'production',
          maxIssues: 5,
          formats: ['json']
        })
      );
    }
    return config;
  }
};
```

--------------------------------

### Jenkins Pipeline for VibeAlive Code Analysis

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/build-integration.md

A Jenkins declarative pipeline script to perform VibeAlive code analysis. It includes stages for checking out code, installing dependencies, running the analysis, and archiving generated reports.

```groovy
pipeline {
  agent any
  stages {
    stage('Analysis') {
      steps {
        sh 'npm ci'
        sh 'npx vibealive analyze . --ci --fail-on-issues --max-issues 5'
        archiveArtifacts artifacts: 'vibealive-reports/**/*'
      }
    }
  }
}
```

--------------------------------

### GitLab CI Configuration for VibeAlive Analysis

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/build-integration.md

GitLab CI configuration to integrate VibeAlive analysis. It uses a Node.js image, installs dependencies, runs the analysis command, and defines artifacts for JUnit reports and generated reports.

```yaml
vibealive_analysis:
  image: node:18-alpine
  script:
    - npm ci
    - npx vibealive analyze . --ci --fail-on-issues --max-issues 5
  artifacts:
    reports:
      junit: vibealive-reports/*.json
    paths:
      - vibealive-reports/
```

--------------------------------

### CircleCI Configuration for VibeAlive Analysis

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/build-integration.md

CircleCI configuration to set up a job for VibeAlive code analysis. It specifies a Node.js Docker image, checks out the code, installs npm dependencies, runs the analysis command, and stores the reports as artifacts.

```yaml
version: 2.1
jobs:
  analyze:
    docker:
      - image: cimg/node:18.17
    steps:
      - checkout
      - run: npm ci
      - run: npx vibealive analyze . --ci --fail-on-issues --max-issues 5
      - store_artifacts:
          path: vibealive-reports
```

--------------------------------

### Multiple Analysis Passes with VibeAlive (JavaScript)

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/webpack-plugin.md

This example shows how to implement multiple analysis passes using the VibeAlive Webpack plugin. It configures a quick analysis for all builds and a more detailed analysis for release builds, using different `confidenceThreshold` and `outputDir` settings.

```javascript
// Different analysis for different purposes
const plugins = [
  // Quick analysis for all builds
  new VibeAliveWebpackPlugin({
    confidenceThreshold: 90,
    formats: ['json'],
    showWarnings: false,
  }),
];

// Detailed analysis for release builds
if (process.env.RELEASE_BUILD === 'true') {
  plugins.push(
    new VibeAliveWebpackPlugin({
      confidenceThreshold: 70,
      formats: ['json', 'md'],
      outputDir: './release-analysis',
      failOnError: true,
    })
  );
}

```

--------------------------------

### TypeScript Client Integration with HTTP Transport

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/mcp.md

Example showing how to connect a TypeScript MCP client to the VibeAlive MCP server using HTTP transport. It requires the server's URL and establishes a connection for communication.

```typescript
import { StreamableHTTPClientTransport } from '@modelcontextprotocol/sdk/client/streamableHttp.js';

const transport = new StreamableHTTPClientTransport(new URL('http://localhost:8080/mcp'));
await client.connect(transport);
```

--------------------------------

### Configure VibeAlive Webpack Plugin in Next.js

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/webpack-plugin.md

This example demonstrates how to integrate the VibeAliveWebpackPlugin into a Next.js application's configuration. It specifically shows how to enable the plugin for production builds on the client-side and configure options like `failOnError`, `maxIssues`, and `formats`.

```javascript
// next.config.js
const { VibeAliveWebpackPlugin } = require('vibealive/webpack');

module.exports = {
  webpack: (config, { dev, isServer }) => {
    // Only run in production builds, client-side
    if (!dev && !isServer) {
      config.plugins.push(
        new VibeAliveWebpackPlugin({
          failOnError: process.env.NODE_ENV === 'production',
          maxIssues: 5,
          formats: ['json'],
        })
      );
    }
    return config;
  },
};
```

--------------------------------

### MCP Client Integration: Scan Directory

Source: https://context7.com/skullzarmy/vibealive/llms.txt

Leverages the MCP client to scan a specific directory within a project. This function supports recursive scanning and exclusion of specific files. It outputs the start of the scan and a job ID for monitoring.

```typescript
// Scan specific directory
const scanResult = await client.callTool({
  name: 'scan-directory',
  arguments: {
    projectPath: '/path/to/project',
    directoryPath: 'src/components',
    options: {
      recursive: true,
      exclude: ['**/*.test.tsx'],
      confidenceThreshold: 85,
    },
  },
});

console.log(scanResult.content[0].text);
```

--------------------------------

### Integrate VibeAlive Config File with Webpack Plugin

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/webpack-plugin.md

This example shows how the VibeAliveWebpackPlugin can load configurations from a `vibealive.config.js` file and how plugin options can override these settings. It's useful for managing consistent analysis settings across a project while allowing build-specific adjustments.

```javascript
// vibealive.config.js
module.exports = {
  webpack: {
    enabled: true,
    options: {
      confidenceThreshold: 85,
      exclude: ['**/test/**', '**/stories/**'],
    },
  },
};

// webpack.config.js - plugin options override config file
new VibeAliveWebpackPlugin({
  failOnError: process.env.CI === 'true', // Override for CI builds
});
```

--------------------------------

### JSON Translation File Structure - VibeAlive

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/i18n.md

Illustrates the structure of a locale JSON file for VibeAlive, based on the default English locale. It shows how different sections like 'cli', 'errors', and 'reports' are organized with key-value pairs for translatable strings. This serves as a template for creating new locale files.

```json
{
  "cli": {
    "analysis": {
      "starting": "🔍 Analyzing Next.js project...",
      "complete": "✅ Analysis complete!"
    },
    "errors": {
      "analysisError": "❌ Analysis failed:"
    }
  },
  "reports": {
    "markdown": {
      "title": "# Next.js Code Analysis Report",
      "executiveSummary": "## 📊 Executive Summary"
    }
  }
}
```

--------------------------------

### MCP Client Integration: Check Single File

Source: https://context7.com/skullzarmy/vibealive/llms.txt

Uses the MCP client to check the status or usage of a specific file within a project. It requires the project path and the file path as arguments. The output indicates the start of the check and provides a job ID for further status retrieval.

```typescript
// Check if specific file is used
const checkResult = await client.callTool({
  name: 'check-file',
  arguments: {
    projectPath: '/path/to/project',
    filePath: 'src/components/Button.tsx',
  },
});

console.log(checkResult.content[0].text);
```

--------------------------------

### Get Project Health Report via TypeScript API

Source: https://context7.com/skullzarmy/vibealive/llms.txt

Retrieves a comprehensive health report for a given project path, optionally including recommendations. This function interacts with the 'validate-project-health' tool. Output includes an overall health score, strengths, and areas for improvement.

```typescript
const healthResult = await client.callTool({
  name: 'validate-project-health',
  arguments: {
    projectPath: '/path/to/project',
    includeRecommendations: true,
  },
});

console.log(healthResult.content[0].text);
```

--------------------------------

### Configure Locale in VibeAlive Config File

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/i18n.md

Shows how to set the default locale for VibeAlive within a project's configuration file (`.vibealive.config.js`). This method provides a persistent way to define the language for analysis and reporting within a specific project, complementing CLI options.

```javascript
// .vibealive.config.js
module.exports = {
  locale: 'es', // Spanish
  // ... other config options
};
```

--------------------------------

### Set Locale via CLI Argument - VibeAlive

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/i18n.md

Demonstrates how to specify a language locale for VibeAlive analysis commands using the `--locale` flag. This allows users to select their preferred language for CLI output and reports. Supported locales include English, Spanish, French, German, Japanese, Chinese, Portuguese, Russian, Italian, and Korean.

```bash
# Use Spanish
vibealive analyze . --locale es

# Use French  
vibealive analyze . --locale fr

# Use German
vibealive analyze . --locale de

# Use Japanese
vibealive analyze . --locale ja

# Use Portuguese
vibealive analyze . --locale pt
```

--------------------------------

### VS Code IDE Configuration with Alternative Package Manager

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/mcp.md

JSON configuration for VS Code's `.vscode/mcp.json` file, demonstrating how to use an alternative package manager like Bun for launching the VibeAlive MCP server via stdio transport.

```json
{
  "servers": {
    "vibealive": {
      "type": "stdio",
      "command": "bunx",
      "args": ["vibealive", "serve", "--stdio"]
    }
  }
}
```

--------------------------------

### Run VibeAlive CLI with Different Package Managers

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/cli.md

Demonstrates how to execute VibeAlive CLI commands using npm, Yarn, and pnpm.

```bash
# npm
npx vibealive analyze .

# Yarn
yarn dlx vibealive analyze .

# pnpm
pnpx vibealive analyze .
```

--------------------------------

### CLI: Analyze Bundle Impact with VibeAlive

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/bundle-analysis.md

Command-line interface for VibeAlive to scan and analyze bundle impact. It accepts the project path and optional arguments for build output path and report formats.

```bash
# Analyze bundle impact with webpack stats
npx vibealive bundle-scan .\n
# Specify build output path
npx vibealive bundle-scan . --build-path ./dist\n
# Generate detailed reports
npx vibealive bundle-scan . --format json,md --output ./bundle-reports
```

--------------------------------

### Initialize and Cleanup VibeAlive Configuration with CLI

Source: https://context7.com/skullzarmy/vibealive/llms.txt

These CLI commands manage the VibeAlive configuration. `vibealive init` initializes the configuration file (`.vibealive/config.js`), optionally with a force overwrite. `vibealive cleanup` removes the configuration directory, with a `--force` flag to bypass confirmation. The tool also checks for `.gitignore` integration.

```bash
# Initialize configuration file
npx vibealive init

# Initialize with force overwrite
npx vibealive init --force

# Expected Output:
# ✅ Created .vibealive/config.js
# 📝 Edit the file to customize your analysis settings.
#
# 🔍 Found .gitignore file.
# ✅ .vibealive/ already in .gitignore

# Clean up configuration
npx vibealive cleanup

# Cleanup without confirmation
npx vibealive cleanup --force

# Expected Output:
# 🧹 VibeAlive Cleanup
# ✅ Removed .vibealive directory
# ✅ Cleanup complete
```

--------------------------------

### Run Vibealive CLI Analysis with Internationalization

Source: https://github.com/skullzarmy/vibealive/blob/main/README.md

Demonstrates how to run the Vibealive analysis command with different locale options for internationalization. This allows for localized output and reporting, supporting languages like Spanish, French, German, and Portuguese.

```bash
# Analyze your Next.js project
npx vibealive analyze . # English (default)

# Use in different languages
npx vibealive analyze . --locale es  # Spanish
npx vibealive analyze . --locale fr  # French
npx vibealive analyze . --locale de  # German
npx vibealive analyze . --locale pt  # Portuguese
```

--------------------------------

### Run VibeAlive CLI Analyze Command

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/cli.md

Scans a Next.js project to generate a comprehensive analysis report. It supports various output formats, custom output directories, exclusion patterns, and confidence thresholds.

```bash
npx vibealive analyze <path-to-project> [options]

# Example:
npx vibealive analyze .

# With custom options:
npx vibealive analyze ./my-project --confidence 90 --exclude "**/test/**"
```

--------------------------------

### Run VibeAlive CLI Bundle Scan Command

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/cli.md

Analyzes the real bundle size impact of unused code by integrating with webpack stats. It allows specifying output formats, directories, and the path to build output.

```bash
npx vibealive bundle-scan <path-to-project> [options]

# Example:
npx vibealive bundle-scan .

# With custom build path:
npx vibealive bundle-scan . --build-path ./dist

# Generate detailed reports:
npx vibealive bundle-scan . --format json,md --output ./bundle-reports
```

--------------------------------

### VibeAlive Push and PR Creation

Source: https://github.com/skullzarmy/vibealive/blob/main/CONTRIBUTING.md

Bash command to push a local branch to the remote repository and instructions on creating a pull request.

```bash
git push origin your-branch-name
```

--------------------------------

### Environment-Specific VibeAlive Analysis Thresholds

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/build-integration.md

Demonstrates how to apply different VibeAlive analysis configurations based on the environment variable NODE_ENV. This allows for more permissive checks in development and stricter checks in staging and production.

```bash
# Development (permissive)
if [ "$NODE_ENV" = "development" ]; then
  npx vibealive analyze . --max-issues 20 --confidence-threshold 70
fi

# Staging (moderate)
if [ "$NODE_ENV" = "staging" ]; then
  npx vibealive analyze . --ci --fail-on-issues --max-issues 10 --confidence-threshold 80
fi

# Production (strict)
if [ "$NODE_ENV" = "production" ]; then
  npx vibealive analyze . --ci --fail-on-issues --max-issues 0 --confidence-threshold 95
fi
```

--------------------------------

### VS Code IDE Configuration with Environment Variables

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/mcp.md

JSON configuration for VS Code's `.vscode/mcp.json` file, showing how to set environment variables for the VibeAlive MCP server when using stdio transport. This allows customization of logging and job limits.

```json
{
  "servers": {
    "vibealive": {
      "type": "stdio",
      "command": "npx",
      "args": ["vibealive", "serve", "--stdio"],
      "env": {
        "VIBEALIVE_LOG_LEVEL": "info",
        "VIBEALIVE_MAX_JOBS": "5"
      }
    }
  }
}
```

--------------------------------

### GitHub Actions CI/CD for Bundle Analysis

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/bundle-analysis.md

Workflow snippet for GitHub Actions to build the project and then scan the bundle using VibeAlive. It includes steps for building, scanning, and uploading the generated analysis artifacts.

```yaml
# GitHub Actions
- name: Build and Analyze Bundle
  run: |
    npm run build
    npx vibealive bundle-scan . --format json

- name: Upload Bundle Analysis
  uses: actions/upload-artifact@v4
  with:
    name: bundle-analysis
    path: vibealive-reports/
```

--------------------------------

### Integration: CI/CD Bundle Analysis with Reports

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/bundle-analysis.md

This command sequence is designed for use in Continuous Integration and Continuous Deployment pipelines. It first builds the project and then performs a full bundle analysis, outputting reports in both JSON and Markdown formats for detailed review.

```bash
npm run build && npx vibealive bundle-scan . --format json,md
```

--------------------------------

### Multi-stage Quality Gates with VibeAlive CLI

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/build-integration.md

Defines multi-stage quality gates for a project using the vibealive CLI. Each stage has a name and a command to execute, with options for issue limits, confidence thresholds, and CI integration. The 'Strict Analysis' stage has a condition for running only in production environments.

```yaml
stages:
  - name: 'Quick Analysis'
    command: 'vibealive analyze . --max-issues 50 --confidence-threshold 60'

  - name: 'Standard Analysis'
    command: 'vibealive analyze . --ci --fail-on-issues --max-issues 10'

  - name: 'Strict Analysis'
    command: 'vibealive analyze . --ci --fail-on-issues --max-issues 0 --confidence-threshold 95'
    condition: 'production'
```

--------------------------------

### Development and Testing Commands

Source: https://github.com/skullzarmy/vibealive/blob/main/CONTRIBUTING.md

A collection of npm scripts for managing the development workflow, including running the application in watch mode, building the project, executing tests (all, watch, coverage, unit, integration), and performing code quality checks like linting and formatting.

```bash
# Development
npm run dev          # Watch mode compilation
npm run build        # Compile TypeScript
npm run test         # Run all tests
npm run test:watch   # Watch mode testing
npm run test:coverage # Generate coverage report

# Code Quality
npm run lint         # Check linting
npm run lint:fix     # Fix linting issues
npm run format       # Format code
npm run format:check # Check formatting

# Specialized Testing
npm run test:unit        # Unit tests only
npm run test:integration # Integration tests only
npm run test:mcp         # MCP server tests
npm run test:cli         # CLI tests
```

--------------------------------

### Load Configuration with CLI Overrides (TypeScript)

Source: https://context7.com/skullzarmy/vibealive/llms.txt

Loads project configuration from a file, allowing for command-line interface overrides. It supports multiple formats and specifies confidence thresholds and exclusion patterns. The function returns a structured configuration object.

```typescript
import { ConfigLoader } from 'vibealive';

// Load config from file with CLI overrides
const config = await ConfigLoader.loadConfig('./my-project', {
  format: ['json', 'md'],
  confidenceThreshold: 90,
  exclude: ['**/temp/**'],
  verbose: true,
});

// Expected config structure:
// {
//   projectRoot: '/absolute/path/to/my-project',
//   nextVersion: '14.2.1',
//   routerType: 'app',
//   typescript: true,
//   excludePatterns: ['node_modules/**', ...],
//   includePatterns: ['**/*.{js,jsx,ts,tsx}'],
//   confidenceThreshold: 90,
//   generateGraph: true
// }
```

--------------------------------

### MCP Client Integration: Analyze Project

Source: https://context7.com/skullzarmy/vibealive/llms.txt

Integrates the MCP client to perform a full project analysis. It connects via stdio transport, initiates an analysis job with specified options, retrieves job status, and fetches the analysis report. Dependencies include the `@modelcontextprotocol/sdk`.

```typescript
import { Client } from '@modelcontextprotocol/sdk/client/index.js';
import { StdioClientTransport } from '@modelcontextprotocol/sdk/client/stdio.js';

// Create MCP client
const client = new Client({
  name: 'vibealive-client',
  version: '1.0.0',
});

// Connect via stdio transport
const transport = new StdioClientTransport({
  command: 'npx',
  args: ['vibealive', 'serve', '--stdio'],
});

await client.connect(transport);

// Start project analysis
const analysisResult = await client.callTool({
  name: 'analyze-project',
  arguments: {
    projectPath: '/path/to/project',
    options: {
      exclude: ['**/test/**'],
      confidenceThreshold: 90,
      generateGraph: true,
    },
  },
});

console.log(analysisResult.content[0].text);

// Check job status
const statusResult = await client.callTool({
  name: 'get-job-status',
  arguments: {
    jobId: '550e8400-e29b-41d4-a716-446655440000',
  },
});

console.log(statusResult.content[0].text);

// Get completed report
const reportResult = await client.callTool({
  name: 'get-analysis-report',
  arguments: {
    jobId: '550e8400-e29b-41d4-a716-446655440000',
    format: 'summary',
  },
});

console.log(reportResult.content[0].text);
```

--------------------------------

### VS Code IDE Configuration for Stdio Transport

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/mcp.md

JSON configuration for VS Code's `.vscode/mcp.json` file to integrate with the VibeAlive MCP server using stdio transport. It specifies the command and arguments to launch the server.

```json
{
  "servers": {
    "vibealive": {
      "type": "stdio",
      "command": "npx",
      "args": ["vibealive", "serve", "--stdio"],
      "env": {
        "NODE_ENV": "production"
      }
    }
  }
}
```

--------------------------------

### Run VibeAlive CLI Focused Scan Commands

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/cli.md

Executes specialized analysis commands for specific project aspects such as theme configuration, SEO, performance, accessibility, advanced patterns, package analysis, and overall project health.

```bash
# Analyze theme configuration and dark mode setup
npx vibealive theme-scan <path>

# Comprehensive SEO audit
npx vibealive seo-scan <path>

# Performance analysis
npx vibealive perf-scan <path>

# WCAG 2.2 Accessibility Audit
npx vibealive a11y-scan <path>

# Advanced Next.js patterns detection
npx vibealive patterns <path>

# Common package analysis
npx vibealive packages <path>

# Overall project health score
npx vibealive health <path>

# Example usage:
npx vibealive theme-scan .
npx vibealive health .
```

--------------------------------

### Analyze Bundle Size Impact with CLI

Source: https://context7.com/skullzarmy/vibealive/llms.txt

This CLI command analyzes the bundle size impact of the Next.js project, reporting the total bundle size, unused code size, potential savings, and gzipped savings. It also provides recommendations for optimizing bundle size, such as removing unused imports or code-splitting components. The build path can be customized.

```bash
npx vibealive bundle-scan .

# With custom build directory
npx vibealive bundle-scan . --build-path ./dist

# Expected Output:
# 📦 Analyzing bundle size impact...
#
# 📊 Bundle Analysis Summary:
# • Total bundle size: 512.4 KB
# • Unused code size: 87.3 KB
# • Potential savings: 87.3 KB (17.0%)
# • Gzipped savings: 32.1 KB
#
# 💡 Top Bundle Recommendations:
# 1. Remove unused lodash imports (Save 45.2 KB)
# 2. Code-split large component tree (Save 28.1 KB)
# 3. Optimize date-fns imports (Save 14.0 KB)
#
# 📦 Bundle analysis completed in 2345 ms
```

--------------------------------

### Upload VibeAlive Reports to Google Cloud Storage

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/build-integration.md

Copies VibeAlive analysis reports recursively from './vibealive-reports' to a Google Cloud Storage bucket, organized by date. Uses `gsutil` for efficient transfer.

```bash
# Google Cloud Storage
gsutil -m cp -r ./vibealive-reports gs://my-bucket/reports/$(date +%Y-%m-%d)/
```

--------------------------------

### Pre-commit Hooks with VibeAlive Analysis

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/build-integration.md

Configuration for using VibeAlive analysis within pre-commit and pre-push hooks via Husky. This allows for code quality checks before committing or pushing code, with different thresholds for each hook.

```json
{
  "husky": {
    "hooks": {
      "pre-commit": "vibealive analyze . --ci --max-issues 10 --silent",
      "pre-push": "vibealive analyze . --ci --fail-on-issues --max-issues 5"
    }
  }
}
```

--------------------------------

### VibeAlive Configuration File (vibealive.config.js)

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/build-integration.md

Configuration object for VibeAlive, allowing customization of analysis settings, build behavior, and CI/CD thresholds. This file enables fine-tuning of the analysis process, including exclusion patterns, maximum issues, and environment-specific rules.

```javascript
module.exports = {
  analysis: {
    confidenceThreshold: 80,
    maxIssues: 5,
    exclude: ['**/test/**', '**/stories/**'],
  },

  build: {
    failOnError: false,
    showWarnings: true,
    environments: ['production'],
    outputDir: './vibealive-reports',
  },

  ci: {
    enabled: false,
    thresholds: {
      development: { maxIssues: 20, failOnError: false },
      production: { maxIssues: 0, failOnError: true },
    },
  },
};
```

--------------------------------

### Validate MCP Integration with npm

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/cli.md

Runs an npm script to test the compatibility of the MCP server integration, covering both stdio and HTTP transports.

```bash
npm run validate-mcp
```

--------------------------------

### Programmatic Usage: Analyzing Bundle with VibeAlive

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/bundle-analysis.md

Programmatic usage of VibeAlive's `NextJSAnalyzer` and `BundleAnalyzer` to analyze project bundles. This snippet demonstrates initializing the analyzer and accessing potential savings from the report.

```typescript
import { NextJSAnalyzer, BundleAnalyzer } from 'vibealive';

const analyzer = new NextJSAnalyzer(config);
const report = await analyzer.analyze();

if (report.bundleAnalysis) {
  console.log('Bundle savings:', report.bundleAnalysis.potentialSavings);
}
```

--------------------------------

### Integration: Development Bundle Analysis Command

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/bundle-analysis.md

This command is used for quick bundle analysis during development. It allows developers to easily check the bundle size and identify potential issues before committing or deploying changes.

```bash
npm run analyze:bundle
```

--------------------------------

### Generate Webpack Stats for Bundle Analysis

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/bundle-analysis.md

Instructions for generating webpack stats, used by VibeAlive for bundle analysis. This includes a temporary modification to `next.config.js` for Next.js projects and a standard webpack command for generic projects.

```bash
# Temporary next.config.js modification to export stats
ANALYZE_BUNDLE=true npm run build
```

```bash
# Standard webpack stats generation
npx webpack --profile --json > stats.json
```

--------------------------------

### Configure Vibealive Debug Mode (JSON)

Source: https://github.com/skullzarmy/vibealive/blob/main/docs/mcp.md

This JSON configuration snippet enables debug logging for the Vibealive server. It specifies the server type as 'stdio', the command to execute as 'npx', and provides arguments to serve the project with stdio enabled. Environment variables, specifically 'DEBUG' set to 'vibealive:*', are configured to capture all debug messages from the 'vibealive' package.

```json
{
  "servers": {
    "vibealive": {
      "type": "stdio",
      "command": "npx",
      "args": ["vibealive", "serve", "--stdio"],
      "env": {
        "DEBUG": "vibealive:*"
      }
    }
  }
}
```

--------------------------------

### Perform Basic Next.js Analysis Programmatically with TypeScript

Source: https://context7.com/skullzarmy/vibealive/llms.txt

This TypeScript code demonstrates how to use the VibeAlive programmatic API to analyze a Next.js project. It involves configuring the `NextJSAnalyzer` with project details, analysis settings (like exclusion patterns and confidence threshold), and then running the analysis. The results, including metadata, summary, file classifications, and recommendations, can be accessed and processed.

```typescript
import { NextJSAnalyzer, AnalysisConfig } from 'vibealive';
import * as path from 'path';

// Configure the analyzer
const config: AnalysisConfig = {
  projectRoot: path.resolve(__dirname, './my-nextjs-app'),
  nextVersion: '14.0.0',
  routerType: 'app', // 'app' | 'pages' | 'hybrid'
  typescript: true,
  excludePatterns: [
    '**/node_modules/**',
    '**/.next/**',
    '**/test/**',
    '**/*.test.{ts,tsx}',
  ],
  includePatterns: ['**/*.{js,jsx,ts,tsx}'],
  confidenceThreshold: 85,
  generateGraph: true,
};

// Run the analysis
const analyzer = new NextJSAnalyzer(config);
const report = await analyzer.analyze();

// Access results
console.log(`Total files: ${report.metadata.totalFiles}`);
console.log(`Unused files: ${report.summary.unusedFiles}`);
console.log(`Potential savings: ${report.summary.potentialSavings.estimatedBundleSize} bytes`);

// Get unused files
const unusedFiles = report.files.filter(f => f.classification === 'UNUSED');
unusedFiles.forEach(file => {
  console.log(`${file.path} - ${file.confidence}% confidence`);
  console.log(`  Reasons: ${file.reasons.join(', ')}`);
});

// Access high-confidence recommendations
const safeDeletions = report.recommendations.filter(r =>
  r.type === 'DELETE' && r.confidence > 90
);
safeDeletions.forEach(rec => {
  console.log(`${rec.target}: ${rec.description}`);
  console.log(`  Action: ${rec.actions[0]}`);
});

// Expected output:
// Total files: 247
// Unused files: 12
// Potential savings: 148352 bytes
// src/components/OldButton.tsx - 95% confidence
//   Reasons: File is not imported by any other reachable file.
// src/components/OldButton.tsx: Unused file with 95% confidence
//   Action: rm "src/components/OldButton.tsx"
```

--------------------------------

### Build Dependency Graph (TypeScript)

Source: https://context7.com/skullzarmy/vibealive/llms.txt

Builds a dependency graph from the scanned files using the provided configuration and project structure. It returns a graph object containing nodes, edges, orphan files, entry points, and cycles. This analysis helps identify code relationships and potential issues.

```typescript
import { DependencyAnalyzer } from 'vibealive';

const analyzer = new DependencyAnalyzer(config, projectStructure);
const graph = await analyzer.buildDependencyGraph(files);

// Access dependency information
console.log(`Total nodes: ${graph.nodes.length}`);
console.log(`Total edges: ${graph.edges.length}`);
console.log(`Orphan files: ${graph.orphans.length}`);
console.log(`Entry points: ${graph.entryPoints.length}`);

// Find circular dependencies
if (graph.cycles.length > 0) {
  console.log('Circular dependencies detected:');
  graph.cycles.forEach(cycle => {
    const paths = cycle.map(node => node.path).join(' -> ');
    console.log(`  ${paths}`);
  });
}

// Expected output:
// Total nodes: 247
// Total edges: 534
// Orphan files: 12
// Entry points: 18
// Circular dependencies detected:
//   src/utils/a.ts -> src/utils/b.ts -> src/utils/a.ts
```