npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

git-split-diffs-api

v0.2.4

Published

Split diffs, now in your terminal

Downloads

10

Readme

This is a fork of git-split-diffs

It exposes a nodejs api to transform git diff result

git-split-diffs

GitHub style split diffs with syntax highlighting in your terminal.

Screenshot of dark theme

Screenshot of github-light theme

Demo 1 | Demo 2

Usage

This currently requires node version 12 or newer to run.

Install globally

npm install -g git-split-diffs

git config --global core.pager "git-split-diffs --color | less -RFX"

Install locally

npm install git-split-diffs

git config core.pager "npx git-split-diffs --color | less -RFX"

Use manually

git diff | git-split-diffs --color | less -RFX

Customization

Line wrapping

By default, lines are wrapped to fit in the screen. If you prefer to truncate them, update the wrap-lines setting:

git config split-diffs.wrap-lines false

Inline changes

By default, salient changes within lines are also highlighted: Screenshot of inline changes

You can disable this with the highlight-line-changes setting:

git config split-diffs.highlight-line-changes false

Syntax highlighting

Syntax highlighting is supported via shiki, which uses the same grammars and themes as vscode. Each theme specifies a default syntax highlighting theme to use, which can be overridden by:

git config split-diffs.syntax-highlighting-theme <name>

The supported syntax highlighting themes are listed at https://github.com/shikijs/shiki/blob/v0.9.3/docs/themes.md

You can disable syntax highlighting by setting the name to empty:

git config split-diffs.syntax-highlighting-theme ''

Narrow terminals

Split diffs can be hard to read on narrow terminals, so we revert to unified diffs if we cannot fit two lines of min-line-width on screen. This value is configurable:

git config split-diffs.min-line-width 40

This defaults to 80, so screens below 160 characters will display unified diffs. Set it to 0 to always show split diffs.

Themes

You can pick between several themes:

Arctic

Based on https://www.nordtheme.com/

git config split-diffs.theme-name arctic

Screenshot of GitHub Dark (Dim) theme

Dark

This is the default theme.

git config split-diffs.theme-name dark

Screenshot of dark theme

Light

git config split-diffs.theme-name light

Screenshot of light theme

GitHub Dark (Dim)

git config split-diffs.theme-name github-dark-dim

Screenshot of GitHub Dark (Dim) theme

GitHub Light

git config split-diffs.theme-name github-light

Screenshot of GitHub Light theme

Solarized Dark

As seen on https://github.com/altercation/solarized

git config split-diffs.theme-name solarized-dark

Screenshot of Solarized Dark theme

Solarized Light

git config split-diffs.theme-name solarized-light

Screenshot of Solarized Light theme

Monochrome Dark

git config split-diffs.theme-name monochrome-dark

Screenshot of Monochrome Dark theme

Monochrome Light

git config split-diffs.theme-name monochrome-light

Screenshot of Monochrome Light theme

Performance

Tested by measuring the time it took to pipe the output git log -p to /dev/null via git-split-diffs with the default theme:

| Features enabled | ms/kloc | | -------------------------------------------------------------- | -------- | | Everything | 4661 | | No syntax highlighting | 40 | | No syntax highlighting, no inline change highlighting | 34 |

1 https://github.com/shikijs/shiki/pull/151 improves this to 333ms/kloc

Troubleshooting

Not seeing diffs side-by-side?

See #narrow-terminals

Not seeing colors, or seeing fewer colors?

Text coloring is implemented using Chalk which supports various levels of color. If Chalk is producing fewer colors than your terminal supports, try overriding Chalk's detection using a variation of the --color flag, e.g. --color=16m for true color. See Chalk's documentation or this useful gist on terminal support if issues persist.

Acknowledgements

  • diff-so-fancy for showing what's possible
  • shikijs for making it easy to do high quality syntax highlighting
  • chalk for making it easy to do terminal styling reliably
  • delta which approaches the same problem in Rust