Git Line Count Visualizer

A zero-dependency dev tool that analyzes a git branch history and visualizes how the line counts of selected file types (e.g. *.js, *.scss) change over time, rendered as an interactive browser chart.

Install

Install as a dev dependency (recommended) and run it with npx:

npm install -D git-line-visualizer

A local install is recommended over a global one (npm i -g). The CLI command is gitline, a name other globally-installed packages might also use; installing locally keeps the command isolated to your project's node_modules/.bin and avoids any conflict.

Usage

Run it from the root of the target project (a git repository):

npx gitline

Your default browser opens automatically with the time-series chart.

Options

Option	Default	Description
--dir <path>	src	Directory to analyze
--branch <name>	master	Branch to analyze
--ext <list>	js,scss	Comma-separated file extensions
--port <number>	4711	Local server port

You can also configure these via the gitline field in the target project's package.json (CLI arguments take precedence):

{
  "gitline": {
    "dir": "src",
    "branch": "master",
    "ext": "js,scss",
    "port": 4711
  }
}

Examples:

# Track TypeScript and CSS on the develop branch
npx gitline --ext ts,tsx,css --branch develop

# Analyze a different directory on a custom port
npx gitline --dir packages/web/src --port 5050

How it works

1. Load the .gitline-cache.json cache.
2. List commits via git log <branch>.
3. Analyze only newly-seen commits (incremental). Line counts are cached per blob SHA, so files unchanged between commits are counted only once. The cache accumulates across branches — switching from master to develop (and back) only analyzes commits not seen before. Changing the extension set invalidates the cache and triggers a full re-analysis.
4. Update the cache.
5. Start a local http server and open the browser.
6. Render the per-extension line-count chart with ECharts (loaded from CDN).

The chart shows one line series per configured extension. Use zoom/scroll to navigate, and click a commit point to see its full hash, message, author, date, and per-extension line counts in the side panel.

Add .gitline-cache.json to your .gitignore.