javascript - How could I show current GIT branch in my Vue 3 Web application

Question

I like to have a visual cue of the current GIT branch I am working on and have that set up in my IDE (I currently use VIM but I know VSCode also does this). I like/need it so much that I would really also like to see it in my development build when serving locally.

I currently do this manually with a label that I update by hand each time I create a new branch to work on. However, I often forget to do this and subsequently confuse myself.

I'm wondering whether it would be possible to pull this information from GIT and show it in my UI in the same way VSCode does?

Specifically I am using Vue 3 and Typescript but I guess that is not super relevant to the general problem.

Anyone have a feel of how you would do this?

标签： javascriptgitvue.js

Answer 1

如果你使用 Webpack 作为打包器，有一个git-commit-info-webpack-plugin可以在每次构建时将一些 Git 信息（分支名称、最后提交日期/哈希/作者）写入 json 文件。

只需将 json 文件导入您的应用程序并使用它....