Using git hashes in Vite & VueJS

To use a git hash in Vite, install git-rev-sync:

$ pnpm install git-rev-sync --save

then add this to your vite.config.ts file:

// Make some git info available as env var - must start with VITE_
import git from 'git-rev-sync'
process.env.VITE_GIT_COMMIT_HASH = git.short()

Then add this to your Vue component to use it:

const gitHash = import.meta.env.VITE_GIT_COMMIT_HASH

then you can output it in templates etc as normal:

<p>{{ gitHash }}</p>

Related Posts