/ #git #cli 

git diff by word

The default diffing algorithm for git diff is by lines. There are scenarios where it’s more interesting to diff by word, for example: long lines. In that case it’s useful to use --word-diff=color.

Table of Contents

Usage is as follows:

git diff --word-diff=color

Options for --word-diff are (see the git diff --word-diff docs):

  • plain: default uses [-removed-] and {+added+} formatting
  • color: uses color to denote changes (no +/- delimiter)
  • porcelain: similar to plain but uses line-based delimiters, plain can be ambiguous, porcelain is meant to be non-ambiguous and for machine consumption

default git diff output

git diff output, which is manageable here:

git diff yarn.lock

diff --git a/yarn.lock b/yarn.lock
index e838f6b..4e659c7 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1874,9 +1874,9 @@ [email protected]^1.2.1:
     is-symbol "^1.0.2"
 
 [email protected]^0.8.24:
-  version "0.8.39"
-  resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.8.39.tgz#18b84a3d56173c55ee8f45bc6c7b5374b0a98ecb"
-  integrity sha512-/do5H74a5ChyeKRWfkDh3EpICXpsz6dWTtFFbotb7BlIHvWqnRrZYDb8IBubOHdEtKzuiksilRO19aBtp3/HHQ==
+  version "0.8.57"
+  resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.8.57.tgz#a42d02bc2b57c70bcd0ef897fe244766bb6dd926"
+  integrity sha512-j02SFrUwFTRUqiY0Kjplwjm1psuzO1d6AjaXKuOR9hrY0HuPsT6sV42B6myW34h1q4CRy+Y3g4RU/cGJeI/nNA==
 
 [email protected]^2.0.0:
   version "2.1.1"

git diff --word-diff output

git diff --word-diff output, great for copy-paste):

git diff --word-diff

diff --git a/yarn.lock b/yarn.lock
index e838f6b..4e659c7 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1874,9 +1874,9 @@ [email protected]^1.2.1:
    is-symbol "^1.0.2"

[email protected]^0.8.24:
  version [-"0.8.39"-]{+"0.8.57"+}
  resolved [-"https://registry.yarnpkg.com/esbuild/-/esbuild-0.8.39.tgz#18b84a3d56173c55ee8f45bc6c7b5374b0a98ecb"-]{+"https://registry.yarnpkg.com/esbuild/-/esbuild-0.8.57.tgz#a42d02bc2b57c70bcd0ef897fe244766bb6dd926"+}
  integrity [-sha512-/do5H74a5ChyeKRWfkDh3EpICXpsz6dWTtFFbotb7BlIHvWqnRrZYDb8IBubOHdEtKzuiksilRO19aBtp3/HHQ==-]{+sha512-j02SFrUwFTRUqiY0Kjplwjm1psuzO1d6AjaXKuOR9hrY0HuPsT6sV42B6myW34h1q4CRy+Y3g4RU/cGJeI/nNA==+}

[email protected]^2.0.0:
  version "2.1.1"

git diff --word-diff=color output

git diff –word-diff=color (screenshot, it doesn’t copy-paste so well):

git diff --word-diff=color output

Photo by Kelly Sikkema on Unsplash

Author

Hugo Di Francesco

Co-author of "Professional JavaScript", "Front-End Development Projects with Vue.js" with Packt, "The Jest Handbook" (self-published). Hugo runs the Code with Hugo website helping over 100,000 developers every month and holds an MEng in Mathematical Computation from University College London (UCL). He has used JavaScript extensively to create scalable and performant platforms at companies such as Canon, Elsevier and (currently) Eurostar.

Get The Jest Handbook (100 pages)

Take your JavaScript testing to the next level by learning the ins and outs of Jest, the top JavaScript testing library.

Find out more close