A Visual Studio Code extension for tracking file changes in DVC-tracked files. This extension provides a dedicated sidebar to monitor file modifications, view line-by-line differences, pixel-bypixel differences for images with multiple viewing options, and revert to the most recent version of dvc tracked files.
-
📂 Sidebar View – Displays DVC-tracked files and their change status.
-
🔄 Refresh Button – Updates the file tracking status with the latest changes.
-
📝 Line-by-Line Diff View – Shows line-by-line differences in the editor window when a file is selected.
DVC_LineByLine_Diff.mp4
-
📝 Image Diff View – Shows Pixel-by-pixel differences in the editor window when the image is selected using three views: Side-by-side, Overlay, and Binary Masking.
DVC_Image_Diff.mp4
-
🎨 Custom Icon – Unique extension icon for easy identification.
- Open VS Code and go to the Extensions view (
Ctrl+Shift+X). - Search for
DVC File Changes Extension. - Click Install.
- Clone this repository:
git clone https://github.com/natitedros/dvc-extension.git
- Open the project in VS Code:
cd dvc-extension cd dvc-change-view code .
- Install dependencies:
npm install
- Build and install the extension:
npm run compile open extension.ts and press F5
- Open the DVC File Changes sidebar from the activity bar.
- Click the Refresh button to fetch the latest tracked file changes.
- Select a file to view its line-by-line differences.
- VS Code v1.75.0 or higher
- DVC installed and configured in the project
The extension automatically detects DVC-tracked files in your workspace. Ensure DVC is properly initialized in your project by running:
dvc initContributions are welcome! To contribute:
- Fork the repository.
- Create a new branch:
git checkout -b feature-branch. - Commit your changes:
git commit -m "Add new feature". - Push the branch:
git push origin feature-branch. - Submit a pull request.
This project is licensed under the MIT License.
🚀 Happy coding with DVC in VS Code!