Display Git’s branch name and commit hash

Execute npm install git-rev-sync --save to install git-rev-sync ( this lib gives access to the git commit hash and branch name )

Add file git-version-gen.js with the following body. This script will generate the git-version.ts which contains the git commit hash and branch name.

    Sample Code:

    const git = require('git-rev-sync');
    const { writeFileSync } = require('fs');

    const gitInfo = { commit: git.short(), commitLong: git.long(), branch: git.branch() };
    const ts = 'export const gitVersion = ' + JSON.stringify(gitInfo, null, 2);

    writeFileSync('src/environments/git-version.ts', ts);

In package.json in scripts add:

• "build": "node git-version-gen.js && ng build …​"

• "serve": "node git-version-gen.js && ng serve …​"

This is to run the git-version-gen.js script so that the git-version.ts will be generated before the serve / build.

The sample below is from wavelet-cp-commerce repo which is slightly different from the rest of the applets as it uses ionic.

To display the git commit hash and branch name in the component.

Sample Code:


import { gitVersion } from '../../../environments/git-version';

// ...

commitBranch = gitVersion.branch;
commitHash = gitVersion.commit;

Add the generated git-version.ts to .gitignore as we want it to be freshly generated every time.

Test out your changes locally as you would normally (e.g. $ ng serve XXX). git-version.ts should be generated. Check the values in the file if they’re correct.

Each time the code is updated, ensure you commit the changes first before publishing to dev, staging or production. So that the latest commit hash is reflected.