Add git information to create-react-app

Question

In development, I want to be able to see the build information (git commit hash, author, last commit message, etc) from the web. I have tried:

• use child_process to execute a git command line, and read the result (Does not work because browser environment)
• generate a buildInfo.txt file during npm build and read from the file (Does not work because fs is also unavailable in browser environment)
• use external libraries such as "git-rev"

The only thing left to do seems to be doing npm run eject and applying https://www.npmjs.com/package/git-revision-webpack-plugin , but I really don't want to eject out of create-react-app. Anyone got any ideas?

Answer 1

On a slight tangent (no need to eject and works in develop), this may be of help to other folk looking to add their current git commit SHA into their index.html as a meta-tag by adding:

REACT_APP_GIT_SHA=`git rev-parse --short HEAD` 

to the build script in the package.json and then adding (note it MUST start with REACT_APP... or it will be ignored):

<meta name="ui-version" content="%REACT_APP_GIT_SHA%"> 

into the index.html in the public folder.

Within react components, do it like this:

<Component>{process.env.REACT_APP_GIT_SHA}</Component>