Weld Merge — A Meld-Style 3-Way Git Merge Tool for VS CodeWeld Merge is a VS Code extension that replicates the fantastic 3-way merge algorithm and interface from the classic Meld diff/merge tool.
This extension brings the power of Meld's intuitive frontend diff viewer and advanced auto-merge heuristics natively into Visual Studio Code. This implicitly includes remote developer support. If you're looking for a dedicated 3-way merge tool and superior Git merge conflict resolution, this Visual Studio Code Git extension provides an unmatched developer experience. Table of Contents
⚠️ Alpha Release NoticeThis extension is currently in alpha. While the core Meld algorithms have been carefully ported and tested, the VS Code UI integration is under active development. Features may be incomplete, behavior may change without notice, and bugs are expected. Please review your merges carefully and report any bugs you find! Use at your own discretion. Installation
Or use Quick Open (Ctrl+P), paste the following command, and press enter:
Want to install from source? See Developer Setup. Why Use This?VS Code's built-in Git conflict resolution is excellent, but its standard interface can sometimes be visually noisy and challenging to navigate during complex merges:
Even the improved built-in 3-way view can still feel less intuitive than dedicated desktop tools like Meld:
Weld Merge for VS Code provides a cleaner, dedicated 3-way merge editor modeled right after the Meld application. Beyond the improved UI, it brings Meld's highly-tuned conflict resolution algorithm that is capable of:
The end result? An intuitive merge experience that handles the tedious work for you.
Features3-Way Merge EditorA side-by-side merge editor that opens directly in VS Code. See local, base, and remote versions with clear visual connections to the merged output.
The highlighted colors represent:
5-Way Compare to BaseEasily toggle diffs between Base and Local/Remote. This is handy to understand what changes were made to arrive at Local and Remote states before deciding how to handle the merge conflicts. Necessary for the more difficult conflicts. Auto-MergeManually trigger auto-merge at any time via the Command Palette: "Weld:
Auto-Merge Current File". This extracts the LOCAL, BASE, and
REMOTE versions via Git and runs them through the Meld Source Control PanelThe extension adds a Weld Merge : Conflicted Files view to the native Source Control (SCM) panel.
How It WorksThis is a straight diff algorithm port plus a reimplementation of the 3-way Meld UI in javascript. To ensure maximum performance and zero external dependencies, we have ported Meld's core Python logic to pure TypeScript. This includes:
The logic runs entirely within the VS Code extension host process—no Python installation or background daemons required. How to Use the ExtensionFrom the Source Control Tab
From the Command Palette (
|
| Action | Shortcut |
|---|---|
| Previous Diff | Alt + Up |
| Next Diff | Alt + Down |
| Previous Conflict | Ctrl + J |
| Next Conflict | Ctrl + K |
The following global shortcut is available to quickly access the conflicted files list:
| Action | Shortcut | |
|---|---|---|
| Focus Conflict List | Alt + M |
(or Cmd + Alt + M on Mac) |
Please note that these default shortcuts may conflict with existing VS Code commands (e.g., Alt+Up/Down for "Move Line", Ctrl+J for "Toggle Panel").
Shortcuts in the Merged editor (Previous/Next Diff/Conflict) are active only when the editor has focus. If they interfere with your workflow or you prefer VS Code's defaults, please be aware that we are considering leaving these unbound by default in future versions to avoid collisions.
Feedback Wanted: Should these stay bound to the Merged editor by default, or should they be opt-in? Let us know in the issues!
Configuration Settings
You can customize the extension using the following VS Code settings (accessible via File > Preferences > Settings):
| Setting | Default | Description |
|---|---|---|
weld.mergeEditor.debounceDelay |
300 |
Delay in milliseconds before recomputing diff highlights while typing. |
weld.mergeEditor.syntaxHighlighting |
true |
Enable or disable syntax highlighting in the merge editor. |
Theme Colors
All diff highlight colors are fully themeable via the workbench colorCustomizations setting in your settings.json:
| Color Token | Default | Description |
|---|---|---|
weldMerge.diffInsertBackground |
#00c80026 |
Background for inserted lines. |
weldMerge.diffDeleteBackground |
#00c80026 |
Background for deleted lines. |
weldMerge.diffReplaceBackground |
#0064ff26 |
Background for replaced lines. |
weldMerge.diffReplaceInlineBackground |
#0064ff59 |
Highlight for inline changed text within replaced lines. |
weldMerge.diffConflictBackground |
#ff000026 |
Background for unresolved conflict lines. |
weldMerge.diffCurtainInsertFill |
#00c80033 |
Fill color for insert regions in the connecting curtain SVG. |
weldMerge.diffCurtainInsertStroke |
#00c80080 |
Stroke color for insert regions in the connecting curtain SVG. |
weldMerge.diffCurtainDeleteFill |
#00c80033 |
Fill color for delete regions in the connecting curtain SVG. |
weldMerge.diffCurtainDeleteStroke |
#00c80080 |
Stroke color for delete regions in the connecting curtain SVG. |
weldMerge.diffCurtainReplaceFill |
#0064ff33 |
Fill color for replace regions in the connecting curtain SVG. |
weldMerge.diffCurtainReplaceStroke |
#0064ff80 |
Stroke color for replace regions in the connecting curtain SVG. |
weldMerge.diffCurtainConflictFill |
#ff000033 |
Fill color for conflict regions in the connecting curtain SVG. |
weldMerge.diffCurtainConflictStroke |
#ff000080 |
Stroke color for conflict regions in the connecting curtain SVG. |
Example settings.json snippet to tweak colors:
"workbench.colorCustomizations": {
"weldMerge.diffConflictBackground": "#ff00001a",
"weldMerge.diffInsertBackground": "#00ff001a"
}
Developer Setup
Run from Source (F5 Launch)
- Clone the repository and open the root folder in VS Code.
- Install dependencies:
npm install - Build the extension:
npm run build - Press
F5to open a new "Extension Development Host" window with the extension loaded.
Testing, Packaging & Manual Install
We use Jest to verify the TypeScript port against Meld's original Python logic:
npm test # run unit tests
npm run test:coverage # run unit tests with code coverage report
npm run test:mutate # run Stryker mutation testing
npm run test:fuzz # run Jazzer.js fuzz testing
npm run test:bench # run performance benchmarks (logic & UI)
npm run lint # lint and format check
npm run build # build, lint etc
npx vsce package # build a .vsix installer
To install the built .vsix locally:
- In VS Code, open the Extensions view (
Ctrl+Shift+X). - Click the
...menu in the top-right corner of the panel. - Select Install from VSIX...
- Locate the downloaded file and click Install.
Credits
Ported and maintained by Pyarelal Knowles. This is a TypeScript port of the Meld visual diff and merge tool; all credit for the core algorithm and fantastic 3-way merge UI belongs to the original Meld developers.
License
GPL Version 2; see LICENSE.
Feedback & Support
If you encounter a bug, have a feature request, or just want to share feedback, please file an issue on our GitHub repository at:
https://github.com/pknowles/weld-merge/issues
Boost developer productivity with an intuitive layout, clear connections, and automated resolutions that standard git tools miss.
Standard VS Code inline conflict view.
Standard VS Code 3-way conflict view.
Conflict resolution made intuitive – Weld resolves conflicts automatically when VS Code cannot.