Visual JSON Diff is a Visual Studio Code extension that provides a visual diff for modified JSON files in Source Control. Effortlessly identify changes in your JSON files with an intuitive, side-by-side visual interface.
- Visual Diff for JSON: See changes in JSON files with a clear, interactive UI.
- Source Control Integration: Right-click modified JSON files in the Source Control panel to launch the visual diff.
- Compare Any Two Files: Search for
Show Visual Diff
in the command palette, select two files and easily view the visual diff. - Custom Object Hashing: Configure which object keys are used to match objects during diffing for more meaningful comparisons.
- Install the extension from the Visual Studio Marketplace.
- Open a JSON file in your workspace, or select two JSON files to compare.
- Use the Command Palette (
Ctrl+Shift+P
orCmd+Shift+P
) and search forShow Visual Diff
to launch the diff viewer. - Or, right-click a modified JSON file in the Source Control panel or Explorer and select Show Visual Diff.
- Make changes to a
.json
or.jsonc
file tracked by Git. - In the Source Control panel, right-click the file and select Show Visual Diff.
- Open the Command Palette and run Show Visual Diff.
- Select two JSON or JSONC files in the Explorer.
You can customize how objects are matched during diffing by configuring the following setting:
"visual-json-diff.objectHashKeys": [
"_id",
"id",
"key",
"name"
]
- Description: An array of property names to use for identifying objects when diffing. The first matching property found (and not null/undefined) will be used as the object's hash. Order matters.
- Visual Studio Code v1.80.0 or higher
Contributions are welcome! Please see the GitHub repository for issues, feature requests, and pull requests.
Enjoy using Visual JSON Diff!