Home

Awesome

<div style="text-align: right;">

δΈ­ζ–‡ | English

</div>

vite-plugin-version-mark

Automatically insert the version or git_commit_sha in your Vite/Nuxt project.

<div align="center"> <a href="https://github.com/ZhongxuYang/vite-plugin-version-mark/tree/main"> <img src="https://raw.githubusercontent.com/ZhongxuYang/images/dev/common/version.svg" width="300px" height="100px" /> </a> </div> <div align="center">

npm version npm downloads types License

Vite Nuxt

Awesome

</div>

Example

Install

pnpm add -D vite-plugin-version-mark
# OR yarn add -D vite-plugin-version-mark
# OR npm install -D vite-plugin-version-mark

Usage

Vite

// vite.config.ts
import {defineConfig} from 'vite'
import {vitePluginVersionMark} from 'vite-plugin-version-mark'

export default defineConfig({
  plugins: [
    vitePluginVersionMark({
      // name: 'test-app',
      // version: '0.0.1',
      // command: 'git describe --tags',
      // outputFile: true,
      // ifGitSHA: true,
      ifShortSHA: true,
      ifMeta: true,
      ifLog: true,
      ifGlobal: true,
    })
  ],
})

Nuxt3+

// nuxt.config.ts
export default defineNuxtConfig({
  modules: [
    ['vite-plugin-version-mark/nuxt', {
      // name: 'test-app',
      // version: '0.0.1',
      // command: 'git describe --tags',
      // outputFile: true,
      // ifGitSHA: true, 
      ifShortSHA: true, 
      ifMeta: true, 
      ifLog: true, 
      ifGlobal: true,
    }]
  ],
})

Then you can use vite-plugin-version-mark ! πŸŽ‰

Config

vite-plugin-version-mark can be print application version in the Console, defined global or add <meta> in HTML element.

NameDescriptionTypeDefaultSupported
nameapplication namestringname in package.json0.0.1+
versionapplication versionstringversion in package.json0.0.1+
ifGitSHAuse git commit SHA as the versionbooleanfalse0.0.1+
ifShortSHAuse git commit short SHA as the versionbooleanfalse0.0.1+
commandprovide a custom command to retrieve the version <br/>For example: git describe --tagsstringgit rev-parse --short HEAD0.0.8+
ifLogprint info in the Consolebooleantrue0.0.1+
ifGlobalset a variable named `__${APPNAME}_VERSION__` in the window<br/>For TypeScript users, make sure to add the type declarations in the env.d.ts or vite-env.d.ts file to get type checks and Intellisense.booleantrue0.0.4+
ifMetaadd <meta name="application-name" content="{APPNAME_VERSION}: {version}"> in the <head>booleantrue0.0.1+
ifExportexport the version field in the entry file. This may be used when you use vite to build a library mode.<br/>Through import { {APPNAME}_VERSION } from <your_library_name>booleanfalse0.0.11+
outputFileThe build generates a static file based on the version, as described in the outputFile configuration below.boolean/functionfalse0.1.1+

The version field takes precedence: command > ifShortSHA > ifGitSHA > version

outputFile Configuration Option

If you want to enable it, you can set it to true, and it will create a file with the path .well-known/version and the content of the current version number in the relative build directory (dist for vite and .output/public for nuxt3).

Alternatively, it can be set to a function that takes the version number as a parameter and returns an object. This allows you to define the content information generated, for example:

// vite.config.ts
vitePluginVersionMark({
  // ...other options

  outputFile: (version) => ({
    path: 'custom/version.json',
    content: `{"version":"${version}"}`,
  })
}),

With this configuration, a file named custom/version.json will be generated, and its content will be {"version":"${current version number}"}.

Other

How to get the version in your vitePlugin?

// vite.config.ts

import {defineConfig} from 'vite'
import type {Plugin} from 'vite'
import {vitePluginVersionMark} from 'vite-plugin-version-mark'

const yourPlugin: () => Plugin = () => ({
  name: 'test-plugin',
  config (config) {
    // get version in vitePlugin if you open `ifGlobal`
    console.log(config.define)
  }
})

export default defineConfig({
  plugins: [
    vue(),
    vitePluginVersionMark({
      ifGlobal: true,
    }),
    yourPlugin(),
  ],
})

How to get the branch to which it belongs through commit SHA?

Through the git command below, you can list all branches containing the specified commit SHA.

git branch -r --contains <COMMIT_SHA>

Star History

Star History Chart

View CHANGELOG

<!-- Badges -->