Nuxt Build Env

Track deployments with build-time info: version, git details, env context and timestamps for Nuxt apps

✨ Features

• 📦 Version - Track your application version
• 🔄 Commit - Full commit hash for precise tracking
• 📎 Short Commit - Abbreviated commit hash for display
• 🌿 Branch - Current branch name
• 🚀 Env - Environment context (dev, preview, canary, release)
• ⏱️ Time - Build timestamp for tracking deployments

Supported platforms:

• Vercel
• Netlify
• Cloudflare Pages
• GitHub Actions
• Standard Git environments

Quick Setup

Install the module to your Nuxt application with one command:

1. Add nuxt-build-info dependency to your project

# Using pnpm
pnpm add -D @phojie/nuxt-build-info

# Using yarn
yarn add --dev @phojie/nuxt-build-info

# Using npm
npm install --save-dev @phojie/nuxt-build-info

2. Add nuxt-build-info to the modules section of nuxt.config.ts

export default defineNuxtConfig({
  modules: [
    '@phojie/nuxt-build-info'
  ],
  buildInfo: {
    // Optional: Set a custom version instead of package.json version
    version: '1.0.0-custom',
  }
})

That's it! You can now use Nuxt Build Env in your Nuxt app ✨

Usage

Composables

<script setup lang="ts">
const { version, commit, shortCommit, branch, env, time } = useBuildInfo()
</script>

<template>
  <div>
    <h1>Build Env</h1>
    <p>Version: {{ version }}</p>
    <p>Commit: {{ commit }}</p>
  </div>
</template>

App Config

<script setup lang="ts">
const { buildInfo } = useAppConfig()
</script>

<template>
  <div>
    <h1>Build Info</h1>
    <pre>{{ JSON.stringify(buildInfo, null, 2) }}</pre>
  </div>
</template>

Contribution

# Install dependencies
npm install

# Generate type stubs
npm run dev:prepare

# Develop with the playground
npm run dev

# Build the playground
npm run dev:build

# Run ESLint
npm run lint

# Run Vitest
npm run test
npm run test:watch