$devvkit learn --librarie bat-&-delta-guide

bat & delta Guide

[cli][diff][syntax-highlighting][productivity]

Dev Productivity

Install

# bat:
brew install bat
sudo apt install bat
# Windows: scoop install bat

# delta:
brew install git-delta
cargo install git-delta
# download from github.com/dandavison/delta/releases

bat is cat with syntax highlighting, git change markers in the gutter, and line numbers. It auto-detects file types (120+ languages) and uses .gitignore to skip files. Use `bat -A` to show non-printable characters. Pipe through `bat -l python` to force a language.

bat integrates everywhere: export BAT_THEME=Dracula, bat --style=plain for CI, bat --show-all for whitespace debugging. Use bat cache --build to rebuild syntax definitions. Alias cat=bat for drop-in replacement.

delta enhances git diffs with syntax highlighting, word-level diff, and side-by-side mode. Configure as git pager: `git config core.pager delta`. It highlights exact changed words (not just lines) and shows line numbers.

bat Basics

bat view file— Syntax-highlighted file.

bat file.py
bat --show-all file.txt
bat -A file.txt
bat --plain file.txt
bat -l rust script.py

bat concatenate— Multiple files.

bat src/*.ts
bat file1.py file2.py file3.py
bat src/main.rs -o combined.txt
bat --file-name custom-name.py file

bat Themes

bat themes— Change color scheme.

bat --list-themes
bat --theme=OneHalfDark file.py
bat --theme=GitHub file.py

# Set default:
export BAT_THEME="Dracula"

bat Integration

bat git integration— See git changes inline.

bat README.md
git show HEAD:file.py | bat -l python
git diff --cached | bat
bat --diff-context=5 diff.patch

delta Setup

delta git pager— Configure delta.

# ~/.gitconfig
[core]
    pager = delta
[interactive]
    diffFilter = delta --color-only
[delta]
    navigate = true

delta Styling

delta side-by-side— Split view diff.

# ~/.gitconfig
[delta]
    side-by-side = true
    line-numbers = true
    diff-stat-align-width = 16

delta word diff colors— Customize diff colors.

[delta "colors"]
    plus-style = green bold
    minus-style = red bold
    plus-emph-style = "#00ff00"
    minus-emph-style = "#ff0000"