# @git-diff-view/core

> @git-diff-view/core

Latest version **0.1.8** (published 2026-10-15) · MIT license · 0 weekly downloads

## Install

```sh
npm install @git-diff-view/core
pnpm add @git-diff-view/core
yarn add @git-diff-view/core
bun add @git-diff-view/core
```

## Health

**Score 65/100 (B)** — status: active.

Positive: has types; esm support; no vulnerabilities; recently updated; high maintenance score.

Warnings: low downloads; pre 1.0.

## Facts

| | |
|---|---|
| Version | 0.1.8 |
| Published | 2026-10-15 |
| First published | 2024-01-30 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 4 |
| Unpacked size | 1.4 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 742 |
| Author | MrWangJustToDo |
| Maintainers | mrwang555 |
| Keywords | diff, diff parse |

## Links

- npm: https://www.npmjs.com/package/@git-diff-view/core
- Repository: https://github.com/MrWangJustToDo/git-diff-view
- Homepage: https://mrwangjusttodo.github.io/git-diff-view
- Issues: https://github.com/MrWangJustToDo/git-diff-view/issues
- npm.io page: https://npm.io/package/@git-diff-view/core

## Dependencies (4)

- [lowlight](https://npm.io/package/lowlight.md) ^3.3.0
- [fast-diff](https://npm.io/package/fast-diff.md) ^1.3.0
- [highlight.js](https://npm.io/package/highlight.js.md) ^11.11.0
- [@git-diff-view/lowlight](https://npm.io/package/@git-diff-view/lowlight.md) ^0.1.8

## Recent versions

- 0.1.8 (latest) — 2026-10-15
- 0.0.1-beta.2 (beta) — 2024-01-31
- 0.1.7 — 2026-07-13
- 0.1.6 — 2026-06-21
- 0.1.5 — 2026-05-26
- 0.1.4 — 2026-05-18
- 0.1.3 — 2026-03-19
- 0.1.2 — 2026-03-12
- 0.1.1 — 2026-03-05
- 0.1.0 — 2026-03-04
- 0.0.40 — 2026-02-26
- 0.0.39 — 2026-02-04
- 0.0.38 — 2026-02-04
- 0.0.37 — 2026-02-04
- 0.0.36 — 2026-01-08
- … 35 more at https://npm.io/package/@git-diff-view/core/versions

## README

# @git-diff-view/core

> Core diff engine for git diff processing with syntax highlighting

[![npm version](https://img.shields.io/npm/v/@git-diff-view/core)](https://www.npmjs.com/package/@git-diff-view/core)
[![npm downloads](https://img.shields.io/npm/dm/@git-diff-view/core)](https://www.npmjs.com/package/@git-diff-view/core)

## Features

- ✅ Git diff parsing and processing
- ✅ Syntax highlighting with HAST AST
- ✅ Split & Unified view data generation
- ✅ Web Worker / Node.js compatible
- ✅ Bundle-based data transfer
- ✅ Theme support (light/dark)

## Installation

```bash
npm install @git-diff-view/core
# or
pnpm add @git-diff-view/core
# or
yarn add @git-diff-view/core
```

## Usage

### Basic Usage

```typescript
import { DiffFile } from "@git-diff-view/core";

// Create diff file instance
const file = new DiffFile(
  oldFileName,
  oldContent,
  newFileName,
  newContent,
  hunks,        // git diff hunks
  oldFileLang,  // e.g., "typescript"
  newFileLang
);

// Initialize theme (optional, default: light)
file.initTheme('dark');

// Initialize diff data
file.init();

// Build view data
file.buildSplitDiffLines();      // For split view
file.buildUnifiedDiffLines();    // For unified view
```

### Advanced: Separate Initialization

```typescript
// For more control over initialization
file.initRaw();      // Parse git diff
file.initSyntax();   // Apply syntax highlighting (optional)

file.buildSplitDiffLines();
file.buildUnifiedDiffLines();
```

### Worker/Server Pattern

Process diff data in a separate thread or server for better performance:

```typescript
// Worker/Server side - generate bundle
const file = new DiffFile(/* ... */);
file.initTheme('dark');
file.init();
file.buildSplitDiffLines();
file.buildUnifiedDiffLines();

const bundle = file.getBundle();
// Send bundle to main thread/client

// Main thread/Client side - reconstruct
import { DiffFile } from "@git-diff-view/core";

const mergedFile = DiffFile.createInstance(data, bundle);

// Use with UI components
<DiffView diffFile={mergedFile} />
```

## API Reference

### DiffFile Class

#### Constructor

```typescript
new DiffFile(
  oldFileName: string,
  oldContent: string,
  newFileName: string,
  newContent: string,
  hunks: string[],
  oldFileLang?: string,
  newFileLang?: string
)
```

#### Methods

| Method | Description |
|--------|-------------|
| `initTheme(theme)` | Set theme ('light' or 'dark') |
| `init()` | Initialize diff data (calls initRaw + initSyntax) |
| `initRaw()` | Parse git diff without syntax highlighting |
| `initSyntax()` | Apply syntax highlighting |
| `buildSplitDiffLines()` | Generate split view data |
| `buildUnifiedDiffLines()` | Generate unified view data |
| `getBundle()` | Export data for transfer |

#### Static Methods

| Method | Description |
|--------|-------------|
| `createInstance(data, bundle)` | Reconstruct DiffFile from bundle |

## Use Cases

- **Client-side**: Direct rendering with UI frameworks
- **Worker pattern**: Offload processing to Web Worker
- **Server-side**: Pre-process diffs in Node.js, send to client
- **Hybrid**: Mix of client and server processing

## Related Packages

- [@git-diff-view/react](https://www.npmjs.com/package/@git-diff-view/react) - React components
- [@git-diff-view/vue](https://www.npmjs.com/package/@git-diff-view/vue) - Vue components
- [@git-diff-view/file](https://www.npmjs.com/package/@git-diff-view/file) - File comparison mode
- [@git-diff-view/lowlight](https://www.npmjs.com/package/@git-diff-view/lowlight) - Default syntax highlighter
- [@git-diff-view/shiki](https://www.npmjs.com/package/@git-diff-view/shiki) - Shiki highlighter
- [@git-diff-view/lezer](https://www.npmjs.com/package/@git-diff-view/lezer) - Lezer highlighter

## License

MIT © [MrWangJustToDo](https://github.com/MrWangJustToDo)

---
_Source: https://npm.io/package/@git-diff-view/core · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._