(Not fully) A Vite plugin to bump version suffixes in source code.
npm install vite-plugin-version-bumper



Automate your cache busting strategy.
Updates version suffixes in your code (e.g., _v1 → _v2) physically.
Designed to work flawlessly with Git Hooks and Vite.
A Vite plugin and CLI tool that automatically bumps version numbers in your source code files. Perfect for cache busting, managing localStorage keys, or updating display versions.
- Standalone CLI: Fast "bump only" mode. Doesn't trigger a heavy Vite build.
- Git Hooks Ready: Perfect for pre-commit hooks (Husky).
- Automated Bumping: Increments version suffixes (e.g., _v1 -> _v2) automatically.
- Fresh Start: Capable of resetting all versions back to _v1.
- Physical Update: Updates the actual source code files.
- Regex Powered: Flexible pattern matching via CLI flags.
``bash`
npm install -D vite-plugin-version-bumperor
yarn add -D vite-plugin-version-bumper
Write your variable with a version suffix:
`typescript`
// src/config.ts
export const CACHE_KEY = "user_settings_v1";
The CLI tool (vite-bumper) is the recommended way to use this package. It modifies files without running a full build.
Note: The CLI does not read vite.config.ts. You must pass configuration via flags.
Update your package.json:
`json
{
"scripts": {
"dev": "vite",
"build": "vite build",
// Default usage (Matches "_v1", "_v2" in src folder)
"bump": "vite-bumper --bump",
// Custom Pattern Usage (e.g. for "build_123")
// Note: You must escape backslashes (\\d+) in JSON strings!
"bump:custom": "vite-bumper --bump --pattern \"_build_(\\d+)\"",
// Resets files back to 1
"fresh": "vite-bumper --fresh"
}
}
`
| Flag | Description | Default |
| :---------- | :-------------------------------------------------------------------- | :--------------------------- |
| --bump | Increments found versions by 1. | false |--fresh
| | Resets found versions to 1. | false |--files
| | Glob pattern for files to scan. | "src/*/.{ts,tsx,js,jsx}" |--pattern
| | Regex string to match versions. Group 1 is prefix, Group 2 is number. | "(_v)(\d+)" |
---
_Optional: Only required if you want the plugin to run inside vite build process automatically (not recommended if using Husky)._
Add it to your vite.config.ts:
`typescript
import { defineConfig } from "vite";
import versionBumper from "vite-plugin-version-bumper";
export default defineConfig({
plugins: [
versionBumper({
files: "src/*/.{ts,tsx,js,jsx}",
pattern: /(_v)(\d+)/g,
}),
],
});
`
---
The most professional way to use this plugin is to bump versions automatically before every commit. This ensures your production server never has to modify source code (avoiding dirty git state on CI/CD).
`bash`
npm install -D husky
npx husky init
Edit .husky/pre-commit:
`bash
#!/bin/sh
. "$(dirname "$0")/_/husky.sh"
echo "🚀 Bumping version..."
Now, every time you commit:
1. Versions are bumped (
_v1 -> _v2).
2. The change is added to the commit.
3. You push a clean, updated state to GitHub.
4. Your VPS/Vercel pulls and builds without errors.---
💡 Example Scenario: Cache Busting
You use
localStorage to save user preferences. You need to invalidate old data after a deployment.1. Code:
const STORAGE_KEY = "app_data_v1";
2. Action: You commit your changes.
3. Husky: Runs vite-bumper --bump.
4. Result: Code becomes const STORAGE_KEY = "app_data_v2";.
5. Effect: On production, the app looks for _v2. The old _v1` data is ignored, effectively resetting the state.MIT