abhyudayasharma / react-git-info Goto Github PK

Get Git commit information in your React App

Home Page: https://www.npmjs.com/package/react-git-info

License: MIT License

JavaScript 55.63% PowerShell 44.37%

babel-plugin-macros react create-react-app git git-commit git-branch git-info git-tags hacktoberfest gatsby gatsbyjs typescript-support

react-git-info's Introduction

react-git-info

Get git commit information in your React Application as a JavaScript object. No configuration necessary if you use create-react-app.

Usage

You need to install this repository as an NPM devDependency:

npm install --save-dev react-git-info

After that you can import the information to your static React files.

import GitInfo from 'react-git-info/macro';

const gitInfo = GitInfo();
console.log(gitInfo.branch);
console.log(gitInfo.tags);
console.log(gitInfo.commit.date);
console.log(gitInfo.commit.hash);
console.log(gitInfo.commit.message);
console.log(gitInfo.commit.shortHash);

// or from JSX
<p>{gitInfo.commit.message}</p>

TypeScript Support

There is built-in TypeScript support, you won't have to install external types.

How it works

This package uses a babel-plugin-macros macro that is preconfigured when you're using a recent version of create-react-app.

react-git-info's People

Contributors

Stargazers

Watchers

Forkers

gregbarcza jfemia snaptags martatesar vasiliy0s ahlemg impulsedeer delyarsa

react-git-info's Issues

Fix for building project inside Docker container

Hi! 👋

Firstly, thanks for your work on this project! 🙂

Today I used patch-package to patch [email protected] for the project I'm working on.

During dockerizing my project within node:16.13.1-alpine base image, I faced with a problem caused by 'wrong' syntax of the git command using under the hood in this package. Actually, the command works bad only inside Node.js alpine image with git installed via next command:

RUN apk update && apk upgrade && \
    apk add --no-cache bash git openssh

I tried to build my project with craco package (craco build) inside the docker image, with copying .git folder and continiously got the problem you can find in the next log:

...
Step 10/30 : RUN yarn install --fronzen-lockfile
 ---> Using cache
 ---> 6cf120e679b6
Step 11/30 : COPY . ./
 ---> 2fb99ebd86c2
Step 12/30 : COPY ./.* ./
 ---> a9dbea65adf8
Step 13/30 : RUN ls -al .git/
 ---> Running in 646493e8277a
total 92
drwxr-xr-x    7 root     root          4096 Feb  2 16:14 .
drwxr-xr-x    1 root     root          4096 Feb  2 16:45 ..
-rw-r--r--    1 root     root         12288 Dec 16 14:51 .MERGE_MSG.swp
-rw-r--r--    1 root     root            67 Feb  1 17:20 COMMIT_EDITMSG
-rw-r--r--    1 root     root          1164 Feb  2 16:44 FETCH_HEAD
-rw-r--r--    1 root     root            38 Feb  1 13:37 HEAD
-rw-r--r--    1 root     root            41 Jan 31 15:19 ORIG_HEAD
-rw-r--r--    1 root     root          2673 Feb  2 16:14 config
-rw-r--r--    1 root     root            73 Dec 14 14:50 description
drwxr-xr-x    2 root     root          4096 Dec 14 14:50 hooks
-rw-r--r--    1 root     root         20169 Feb  2 11:50 index
drwxr-xr-x    2 root     root          4096 Dec 14 14:50 info
-rw-r--r--    1 root     root           323 Jan 12 13:59 lint-staged_unstaged.patch
drwxr-xr-x    3 root     root          4096 Dec 14 14:50 logs
drwxr-xr-x  260 root     root          4096 Feb  2 16:44 objects
-rw-r--r--    1 root     root           559 Dec 28 15:04 packed-refs
drwxr-xr-x    5 root     root          4096 Feb  1 11:50 refs
Removing intermediate container 646493e8277a
 ---> a737f347fa14
Step 14/30 : RUN cat .git/HEAD
 ---> Running in 5fb240452242
ref: refs/heads/feat/dockerize-client
Removing intermediate container 5fb240452242
 ---> 852f6a0489f6
Step 15/30 : RUN git log --format=%D%n%h%n%H%n%cI%n%B HEAD
 ---> Running in 80e4d13b4027
fatal: ambiguous argument 'HEAD': both revision and filename
Use '--' to separate paths from revisions, like this:
'git <command> [<revision>...] -- [<file>...]'
The command '/bin/sh -c git log --format=%D%n%h%n%H%n%cI%n%B HEAD' returned a non-zero code: 128
ERROR: Service 'react-client' failed to build : Build failed

After gooling I found the reason - the wrong command format, so here is a diff that solved my problem:

diff --git a/node_modules/react-git-info/src/GitInfo.macro.js b/node_modules/react-git-info/src/GitInfo.macro.js
index 6f41f5d..7d6b9f9 100644
--- a/node_modules/react-git-info/src/GitInfo.macro.js
+++ b/node_modules/react-git-info/src/GitInfo.macro.js
@@ -7,7 +7,7 @@ const parsedGitLog = (() => {
   const commit = {};
   // only the commit message can have multiple lines. Make sure to always add at the end:
   // The format is specified in https://git-scm.com/docs/git-log#_pretty_formats
-  let gitCommand = 'git log --format=%D%n%h%n%H%n%cI%n%B -n 1 HEAD';
+  let gitCommand = 'git log --format=%D%n%h%n%H%n%cI%n%B -n 1 -- HEAD';
   if (process.platform === 'win32') {
     gitCommand = gitCommand.replace(/%/g, '^%'); // need to escape percents in batch
   }

This issue body was partially generated by patch-package.

Totals commit

Hello, is possible add Total commit number of branch?

thanks

getting some issues

Build at Heroku fails with "not a git repository"

I tryed to deploy a release in Heroku, and ended with error "not a git repository" when build react app. It seams that heroku builds the project in another folder than where it has pulled from the repository (in this case /tmp/build_546350ec).

There's a workaround for this?

remote:        Creating an optimized production build...        
remote: fatal: not a git repository (or any parent up to mount point /)        
remote: Stopping at filesystem boundary (GIT_DISCOVERY_ACROSS_FILESYSTEM not set).        
remote:        Failed to compile.        
remote:                
remote:        Error: /tmp/build_546350ec/frontend/src/components/layout/footer.tsx: Command failed: git log --format=%D%n%h%n%H%n%cI%n%B -n 1 HEAD --        
remote:        fatal: not a git repository (or any parent up to mount point /)        
remote:        Stopping at filesystem boundary (GIT_DISCOVERY_ACROSS_FILESYSTEM not set).        
remote:            at transformFile.next (<anonymous>)        
remote:            at run.next (<anonymous>)        
remote:            at transform.next (<anonymous>)        
remote:                
remote:                
remote: error Command failed with exit code 1.        
remote:        info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.        
remote: error Command failed.        
remote: Exit code: 1        
remote: Command: /tmp/build_546350ec/.heroku/node/bin/node        
remote: Arguments: /tmp/build_546350ec/.heroku/yarn/lib/cli.js build        
remote: Directory: /tmp/build_546350ec/frontend

Don't use --show-current

It's a more recent feature in git so not available in all environments, I updated my local git installation and it works. But it's failing in my CI pipeline because the docker image I'm using has an older version of git (official node:10, which is not that old).

Would be better to use:

git rev-parse --abbrev-ref HEAD

as it's more likely to work everywhere.

Question: can this work with React Native?

I'm wondering if there's a way to get this to work with React Native. This package seems to drop to the command line at runtime so it's not going to work on a device, it would need to grab the git info when compiling the app (maybe via some babel-plugin or something). However, I've so far not found a way to make it work—is this even possible for react-native?

Format date?

Is there a way to pass a formatting argument?

i.e. --date=format:'%Y-%m-%d %H:%M:%S'

getting 4 5 issues like ,, /node_modules/react-git-info/src/GitInfo.macro.js Module not found: Error: Can't resolve 'child_process' in

react_devtools_backend.js:2574 ./node_modules/cosmiconfig/dist/readFile.js
Module not found: Error: Can't resolve 'fs' in 'C:\Users\Admin\Desktop\myproject\node_modules\cosmiconfig\dist'
------
react_devtools_backend.js:2574 ./node_modules/import-fresh/node_modules/resolve-from/index.js
Module not found: Error: Can't resolve 'fs' in 'C:\Users\Admin\Desktop\myproject\node_modules\import-fresh\node_modules\resolve-from'
------
/node_modules/path-type/index.js
Module not found: Error: Can't resolve 'fs' in 'C:\Users\Admin\Desktop\myproject\node_modules\path-type'
----------
/node_modules/resolve/lib/async.js
Module not found: Error: Can't resolve 'fs' in 'C:\Users\Admin\Desktop\swift projects\swift-frontend\node_modules\resolve\lib'

Include git describe

Discussed in #25

^{Originally posted by alex-jesper May 3, 2022}
Hi,
The code seems to work well, however I need the output from "git describe --tags", which does not seem to be present.

Is it possible to extend the functionality to include that?

Thanks,
Jesper

Add support for output of git describe described in https://git-scm.com/docs/git-describe#_examples

Git tag not being displayed

Hi,

I noticed that git tag is not being displayed.

git log --decorate=full --format=%D%n%h%n%H%n%cI%n%B -n 1 HEAD
HEAD -> refs/heads/main, refs/remotes/origin/main
96df201
96df201ce1fe2f9012c983690e2913b26f889e86
2020-10-04T11:16:08+01:00
fixed fetch issue

Here is a list of my tags

 git tag
v0.1.0

the following command displays tag

git log --decorate --all --oneline --graph
* 96df201 (HEAD -> main, origin/main) fixed fetch issue
* 2b951de first commit
* 645d9ee (tag: v0.1.0) first commit