# @codemirror/merge

> A diff/merge view for CodeMirror

Latest version **6.12.2** (published 2026-06-09) · MIT license · 0 weekly downloads

## Install

```sh
npm install @codemirror/merge
pnpm add @codemirror/merge
yarn add @codemirror/merge
bun add @codemirror/merge
```

## Health

**Score 60/100 (C)** — status: active.

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads.

## Facts

| | |
|---|---|
| Version | 6.12.2 |
| Published | 2026-06-09 |
| First published | 2022-11-10 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 5 |
| Unpacked size | 179.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Marijn Haverbeke |
| Maintainers | marijn |
| Keywords | editor, code, diff, merge |

## Links

- npm: https://www.npmjs.com/package/@codemirror/merge
- Repository: https://code.haverbeke.berlin/codemirror/merge
- npm.io page: https://npm.io/package/@codemirror/merge

## Dependencies (5)

- [style-mod](https://npm.io/package/style-mod.md) ^4.1.0
- [@codemirror/view](https://npm.io/package/@codemirror/view.md) ^6.17.0
- [@lezer/highlight](https://npm.io/package/@lezer/highlight.md) ^1.0.0
- [@codemirror/state](https://npm.io/package/@codemirror/state.md) ^6.0.0
- [@codemirror/language](https://npm.io/package/@codemirror/language.md) ^6.0.0

## Alternatives

- [flatbuffers](https://npm.io/package/flatbuffers.md) — 6.0M weekly downloads
- [jwt-simple](https://npm.io/package/jwt-simple.md) — 259.5K weekly downloads
- [@exodus/patch-broken-hermes-typed-arrays](https://npm.io/package/@exodus/patch-broken-hermes-typed-arrays.md) — 28.5K weekly downloads
- [@native-to-anchor/buffer-layout](https://npm.io/package/@native-to-anchor/buffer-layout.md) — 12.2K weekly downloads
- [binary-parser-encoder](https://npm.io/package/binary-parser-encoder.md) — 5.3K weekly downloads

## Recent versions

- 6.12.2 (latest) — 2026-06-09
- 6.12.1 — 2026-03-11
- 6.12.0 — 2026-02-15
- 6.11.2 — 2025-11-07
- 6.11.1 — 2025-10-23
- 6.11.0 — 2025-10-02
- 6.10.2 — 2025-06-09
- 6.10.1 — 2025-05-14
- 6.10.0 — 2025-03-06
- 6.9.0 — 2025-03-03
- 6.8.0 — 2024-12-30
- 6.7.5 — 2024-12-17
- 6.7.4 — 2024-11-13
- 6.7.3 — 2024-11-05
- 6.7.2 — 2024-10-10
- … 29 more at https://npm.io/package/@codemirror/merge/versions

## README

# @codemirror/merge [![NPM version](https://img.shields.io/npm/v/@codemirror/merge.svg)](https://www.npmjs.org/package/@codemirror/merge)

[ [**WEBSITE**](https://codemirror.net/) | [**DOCS**](https://codemirror.net/docs/ref/#merge) | [**ISSUES**](https://code.haverbeke.berlin/codemirror/dev/issues) | [**FORUM**](https://discuss.codemirror.net/) | [**CHANGELOG**](https://code.haverbeke.berlin/codemirror/merge/src/branch/main/CHANGELOG.md) ]

This package implements a merge interface for the
[CodeMirror](https://codemirror.net/) code editor.

The [project page](https://codemirror.net/) has more information, a
number of [examples](https://codemirror.net/examples/) and the
[documentation](https://codemirror.net/docs/ref/#merge).

This code is released under an
[MIT license](https://code.haverbeke.berlin/codemirror/merge/tree/main/LICENSE).

We aim to be an inclusive, welcoming community. To make that explicit,
we have a [code of
conduct](http://contributor-covenant.org/version/1/1/0/) that applies
to communication around the project.

## Usage

A split merge view can be created like this:

```javascript
import {MergeView} from "@codemirror/merge"
import {EditorView, basicSetup} from "codemirror"
import {EditorState} from "@codemirror/state"

let doc = `one
two
three
four
five`

const view = new MergeView({
  a: {
    doc,
    extensions: basicSetup
  },
  b: {
    doc: doc.replace(/t/g, "T") + "\nSix",
    extensions: [
      basicSetup,
      EditorView.editable.of(false),
      EditorState.readOnly.of(true)
    ]
  },
  parent: document.body
})
```

Or a unified view like this:

```javascript
import {EditorView, basicSetup} from "codemirror"
import {unifiedMergeView} from "@codemirror/merge"

const view = new EditorView({
  parent: document.body,
  doc: "one\ntwo\nthree\nfour",
  extensions: [
    basicSetup,
    unifiedMergeView({
      original: "one\n...\nfour"
    })
  ]
})
```

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