Detect Changed Files with git

By  on  

There are numerous reasons to want to know which files have been added or modified in a git repository, one of which is your text editor highlighting those files. Another use case is running tasks against only files which are presently changed, like lint or other validation routines.

So how can we identify files which are added or changed? Like this:

git ls-files --others --exclude-standard ; git diff-index --name-only --diff-filter=d HEAD ;

And if you only want to run a routine on a certain portion of files, you can use a regular expression to do so:

{ git ls-files --others --exclude-standard ; git diff-index --name-only --diff-filter=d HEAD ; } | grep --regexp='[.]js$'

The MetaMask team uses the following to run linting on only changed files:

{ git ls-files --others --exclude-standard ; git diff-index --name-only --diff-filter=d HEAD ; } | grep --regexp='[.]js$' | tr '\\n' '\\0' | xargs -0 eslint --fix

Tricks like this are so useful and reliable; you put them in place once and don't consciously think about them again -- and that's OK. Set it and forget it!

Recent Features

  • By
    Creating Scrolling Parallax Effects with CSS

    Introduction For quite a long time now websites with the so called "parallax" effect have been really popular. In case you have not heard of this effect, it basically includes different layers of images that are moving in different directions or with different speed. This leads to a...

  • By
    Chris Coyier’s Favorite CodePen Demos

    David asked me if I'd be up for a guest post picking out some of my favorite Pens from CodePen. A daunting task! There are so many! I managed to pick a few though that have blown me away over the past few months. If you...

Incredible Demos

  • By
    Truly Responsive Images with responsive-images.js

    Responsive web design is something you hear a lot about these days. The moment I really started to get into responsive design was a few months ago when I started to realise that 'responsive' is not just about scaling your websites to the size of your...

  • By
    MooTools Window Object Dumping

    Ever want to see all of the information stored within the window property of your browser? Here's your chance. The XHTML We need a wrapper DIV that we'll consider a console. The CSS I like making this look like a command-line console. The MooTools JavaScript Depending on what you have loaded...


    Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!