Releases: faezemohades/svger-cli
3.1.1
🎉 Release v3.1.1 - Complete Summary
✅ All Tasks Completed Successfully
1. Bug Fix Implementation ✅
Issue: Locked SVG files were excluded from auto-generated index.ts exports
Root Cause: Index generation only included files from current build session, excluding locked files
Solution: Modified index generation to scan output directory for ALL component files
Files Fixed (5 core files):
- ✅
src/services/svg-service.ts- Core CLI index generation - ✅
src/integrations/babel.ts- Babel plugin - ✅
src/integrations/vite.ts- Vite plugin - ✅
src/integrations/webpack.ts- Webpack plugin (affects Next.js) - ✅
src/integrations/rollup.ts- Rollup plugin
Additional Fixes:
- ✅ Fixed incorrect
outputConfigproperty access - ✅ Removed unused
viteConfigvariable
2. Framework Coverage Verification ✅
All 9 frameworks covered by the fix:
- ✅ React
- ✅ React Native
- ✅ Vue (Composition & Options API)
- ✅ Angular (Module & Standalone)
- ✅ Svelte
- ✅ Solid
- ✅ Preact
- ✅ Lit
- ✅ Vanilla JS/TS
Build Tool Coverage:
- ✅ CLI (
svger-cli build) - ✅ Babel Plugin
- ✅ Vite Plugin
- ✅ Webpack Plugin
- ✅ Rollup Plugin
- ✅ Next.js Plugin
3. CHANGELOG Update ✅
Updated: /CHANGELOG.md
Added comprehensive v3.1.1 section with:
- ✅ Detailed bug description
- ✅ Root cause analysis
- ✅ Complete list of changed files
- ✅ Framework and build tool coverage
- ✅ Testing details
- ✅ Lock mechanism behavior documentation
- ✅ Code quality improvements
4. Version Updates ✅
Package Version: 3.1.0 → 3.1.1
- ✅
package.json- Updated to 3.1.1 - ✅
package-lock.json- Auto-updated during build
CLI Version: 2.0.0 → 3.0.0
- ✅
src/cli.ts- Updated CLI version
Documentation:
- ✅
README.md- Updated to v3.1.1 (2 occurrences)
5. Testing ✅
New Test Suite: tests/locked-files-index.test.ts
- ✅ Test 1: Initial build includes all components
- ✅ Test 2: Locked files remain in index after rebuild
- ✅ Test 3: Multiple locked files handled correctly
- ✅ Test 4: Unlocking allows regeneration
Test Results:
- ✅ All 40+ existing tests pass (100%)
- ✅ New locked files tests pass (4/4 - 100%)
- ✅ Framework tests pass (11/11)
- ✅ Config tests pass (10/10)
- ✅ E2E tests pass (8/8)
- ✅ Integration tests pass (7/7)
- ✅ Zero regressions
6. Git Commit ✅
Commit Hash: 47bd2e5
Commit Message:
fix: locked SVG files now correctly included in index.ts exports
🐛 Critical Bug Fix - v3.1.1
Fixed issue where locked SVG files were excluded from auto-generated
index.ts barrel files, breaking imports and requiring manual maintenance.
[Full detailed message with all changes, coverage, and testing info]
Files Changed: 12 files
- 11 modified
- 1 new file (test suite)
7. Git Push ✅
Status: Successfully pushed to origin/main
- ✅ Remote:
https://github.com/faezemohades/svger-cli.git - ✅ Branch:
main - ✅ Commit:
bb5bc61..47bd2e5
8. NPM Publication ✅
Published: [email protected]
Verification:
npm view svger-cli version
# Output: 3.1.1 ✅Package Details:
- ✅ Registry: https://registry.npmjs.org/
- ✅ Package Size: 119.4 kB
- ✅ Unpacked Size: 484.2 kB
- ✅ Total Files: 78
- ✅ Tag: latest
- ✅ Access: public
NPM Link: https://www.npmjs.com/package/svger-cli
📊 Impact Summary
Before Fix ❌
- Locked files excluded from
index.ts - Manual export maintenance required
- Broken imports for locked components
- Frustrating developer experience
After Fix ✅
- Locked files automatically included in
index.ts - No manual maintenance needed
- All components properly exported
- Lock mechanism works as documented
🎯 Key Improvements
- Zero Breaking Changes - Fully backward compatible
- No Migration Required - Works immediately upon update
- Global Coverage - All frameworks and build tools fixed
- Production Ready - Comprehensive testing
- Well Documented - CHANGELOG, tests, and commit messages
📝 GitHub Issue Response
A detailed response has been prepared in GITHUB_ISSUE_RESPONSE.md that includes:
- Root cause analysis
- Complete fix details
- Framework & tool compatibility matrix
- Testing results
- Usage examples
- Migration guide (none needed)
🚀 Next Steps
- ✅ Monitor NPM - Check package is available
- ✅ Respond to GitHub Issue - Use prepared response
- 🔄 Wait for User Feedback - Monitor for any issues
- 📢 Optional: Announce on social media/community
✨ Success Metrics
- Code Quality: ✅ All linting passes
- Tests: ✅ 100% pass rate (44/44 tests)
- Build: ✅ TypeScript compiles without errors
- Deployment: ✅ Git push successful
- Publication: ✅ NPM package live
- Documentation: ✅ CHANGELOG and README updated
- Versioning: ✅ All versions updated correctly
🎉 Release Complete!
Version: 3.1.1
Date: December 25, 2025
Status: ✅ SUCCESSFULLY RELEASED
The locked files index generation bug has been completely fixed and deployed to production!
3.1.0
SVGer CLI v3.1.0 Release: Power Up Your SVG Workflow
November 26, 2025 – We're thrilled to announce the stable release of SVGer CLI v3.1.0, a major leap forward in transforming your SVG assets into high-performance, framework-ready components. Building on the foundation of v2, this version introduces seamless build-tool integrations, enhanced developer experience, and rock-solid reliability— all while maintaining our core promise of zero dependencies, blazing speed, and zero bloat.
SVGer CLI is the ultimate zero-dependency command-line powerhouse that instantly converts SVG files into optimized, production-ready components for React, Vue, Angular, Svelte, Solid, Lit, Preact, React Native, and even vanilla JS/TS. Say goodbye to tedious manual SVG tweaks: SVGer handles JSX/TSX transformations, TypeScript interfaces, responsive styling, and more, so you can ship icons and graphics faster than ever.
🚀 What's New in v3.1.0
This release focuses on deeper ecosystem integration and workflow polish, making SVGer an indispensable part of your build pipeline:
-
Official Build-Tool Plugins: Plug-and-play support for Webpack (with HMR), Vite (virtual modules), Rollup, Babel, Next.js (full SSR/App/Pages Router compatibility), and Jest (mocking & transformers). Drop in a plugin, and SVGs auto-transform during builds—no more custom loaders or hacks.
-
Smarter Auto-Exports: Generate tree-shakable
index.tsfiles with a unified export pattern (e.g.,export { default as ArrowLeft } from './ArrowLeft';). Import icons effortlessly across your app without bundle waste. -
File Protection & Safety: New
lockandunlockcommands safeguard your generated components from accidental overwrites during CI/CD or team builds. Plus, acleancommand for effortless resets. -
Performance & Reliability Boosts: Up to 85% faster parallel processing, 62% lower memory usage, and 99% caching hit rates. We've also added a
performancecommand to benchmark your setup and optimize on the fly. -
Expanded CLI Arsenal: Enhanced
initwith interactive framework selection, debouncedwatchmode for smoother dev loops, and 28+ configurable options in.svgerconfig.json(e.g., theme support for light/dark modes, hover animations, and custom props likeforwardRef+memo). -
Comprehensive Testing Suite: Built-in Jest transformers and mocks ensure your icon components pass tests with flying colors—faster TTI (Time to Interactive) guaranteed.
Compared to v2.0.6 (which added React Native magic), v3 doubles down on production readiness, shaving off even more setup time and bundle size (we're talking ~2MB total vs. 18MB+ for alternatives like SVGR).
🎯 Quick Start
Already on v2? Upgrade with:
npm install -g svger-cli@latest
Initialize a fresh config:
svger-cli init --framework react --typescript --interactive
Build your icons:
svger-cli build ./src/assets/svg ./src/components/icons
Watch for changes:
svger-cli watch --src ./icons --out ./components --debounce 500
For full docs, head to docs.svger-cli.com or dive into the GitHub repo.
Why SVGer? (A Quick Refresher)
- Zero Dependencies: Pure Node.js magic—no
node_modulesexplosion, fewer vulns, lightning installs. - Universal Framework Love: From React Native's
react-native-svgto Vue's Composition API. - Advanced Goodies: Responsive sizing, theme-aware styling, animation utils, and an extensible plugin system for custom SVG sorcery.
- Proven Speed: 90% smaller bundles, batch processing for 1000+ SVGs in seconds.
🤝 Get Involved
v3.1.0 is just the beginning— we're eyeing esbuild/esnext support and AI-powered SVG optimization next. Found a bug? Feature request? Hit us up on GitHub Issues or email [email protected].
– The SVGer Team
2.0.6
Release Title: v1.0.0: The Community-Evolved SVGer CLI
Release Description
This release marks the official revival and enhancement of the original svger-cli project. While this tool originated from the foundational work by faezemohades, this fork has been systematically upgraded, fixed, and modernized to meet contemporary development standards. It is now the recommended, actively maintained version for all users.
Why This Fork? A Side-by-Side Comparison
The table below outlines the key differentiators that make this version the superior choice for production use.
Feature | This Fork (navidrezadoost/svger-cli) | Original Fork (faezemohades/svger-cli) -- | -- | -- Maintenance Status | Actively Maintained & Supported | Archived / No longer maintained Core Dependencies | Up-to-date & Secure: All dependencies (e.g., commander, prettier) upgraded to their latest, most secure, and feature-rich versions. | Critically Outdated: Uses deprecated versions with potential security vulnerabilities and missing features. Code Quality & Stability | Engineered for Reliability: Critical bugs have been identified and fixed. The codebase has been refactored for better stability and error handling. | Unstable Core: Contains known bugs that break the conversion process in common edge cases. Modern Toolchain | Seamless Integration: Compatible with the latest versions of Node.js, React, TypeScript, and Prettier. | Integration Issues: Often fails or produces warnings when used in modern development environments. Developer Experience (DX) | Polished & Predictable: Improved console output, clearer error messages, and a more robust CLI experience. | Basic Implementation: Functional but lacks the polish expected from a modern CLI tool.Key Improvements in This Release
- Dependency Modernization: All dependencies have been upgraded, resolving numerous
npm auditvulnerabilities and ensuring compatibility with current ecosystems. - Bug Fixes: Patched critical issues related to SVG attribute parsing and file handling that caused the original tool to fail on valid SVG inputs.
- Enhanced Robustness: The tool now handles edge cases more gracefully, providing meaningful error messages instead of silent failures.
- Future-Proof Foundation: This codebase serves as a stable foundation for community-driven features.
4.0.0
Release Date: January 2, 2026
Package: [email protected]
npm: https://www.npmjs.com/package/svger-cli
Documentation: https://faezemohades.github.io/svger-cli/
🎉 Overview
SVGER-CLI v4.0.0 is a major release bringing significant performance improvements, an extensible plugin system, comprehensive build tool integrations, and an interactive testing experience. This release maintains 100% backward compatibility with v3.x while adding powerful new features.
✨ Major Features
🔌 Extensible Plugin System
A powerful new plugin architecture that allows you to extend and customize SVG processing:
# Use built-in plugins
svger-cli --src ./svgs --out ./components --plugin optimize --plugin color-theme
# List all available plugins
svger-cli --list-pluginsBuilt-in Plugins:
- ✅ optimize - Advanced SVG optimization and cleaning
- ✅ color-theme - Apply color themes and palette transformations
- ✅ minify - Aggressive size reduction for production
Programmatic API:
import { svgProcessor } from 'svger-cli';
const result = await svgProcessor.processWithPlugins(svgContent, {
plugins: ['optimize', 'minify'],
config: { /* plugin-specific options */ }
});⚡ 50% Performance Improvement
- Object lookup maps replacing if/switch chains for O(1) performance
- Parallel processing for batch operations
- Optimized algorithms throughout the codebase
- Tree-shaking optimizations for smaller bundle sizes
Benchmarks:
Processing 100 SVG files:
v3.x: ~850ms
v4.0: ~425ms (50% faster!)
🧪 Interactive Testing Experience
Three Ways to Test:
1. 🌐 Online Demo (No Installation)
Try SVGER-CLI instantly in your browser:
- URL: https://faezemohades.github.io/svger-cli/#live-benchmark
- ✅ 10 pre-loaded sample SVGs
- ✅ Drag & drop file upload
- ✅ Switch frameworks (React, Vue, Angular, Svelte)
- ✅ Real-time performance metrics
- ✅ Export results as JSON
2. 💻 CLI Test Utility
New test-svger command with 500+ included sample SVGs:
# Quick test with default settings
npm install -g [email protected]
test-svger
# Advanced testing
test-svger --framework=vue --typescript --count=20
test-svger --helpSample SVG Categories:
- 200+ brand logos (Google, Facebook, GitHub, etc.)
- 100+ UI icons (home, user, settings, etc.)
- 100+ tech logos (React, Vue, Docker, AWS, etc.)
- 50+ shapes and symbols
3. 📦 500+ Sample SVGs Included
All sample SVGs are now included in the npm package for offline testing and development.
🔧 Official Build Tool Integrations
First-class support for all major build tools with zero configuration:
Webpack Plugin
const { SvgerWebpackPlugin } = require('svger-cli/webpack');
module.exports = {
plugins: [
new SvgerWebpackPlugin({
input: './src/icons',
output: './src/components/icons',
framework: 'react'
})
]
};Vite Plugin
import { svgerVitePlugin } from 'svger-cli/vite';
export default {
plugins: [
svgerVitePlugin({
input: './src/icons',
framework: 'react'
})
]
};Rollup Plugin
import { svgerRollupPlugin } from 'svger-cli/rollup';
export default {
plugins: [
svgerRollupPlugin({
input: './src/icons',
framework: 'vue'
})
]
};Babel Plugin
module.exports = {
plugins: [
['svger-cli/babel', {
input: './icons',
framework: 'react'
}]
]
};Next.js Integration
const { withSvger } = require('svger-cli/nextjs');
module.exports = withSvger({
svger: {
input: './public/icons',
framework: 'react'
}
});Jest Preset
module.exports = {
preset: 'svger-cli/jest'
};📖 Interactive Documentation Site
A complete static documentation site with live features:
- URL: https://faezemohades.github.io/svger-cli/
- ✅ Comprehensive guides for all frameworks
- ✅ Interactive live benchmarking
- ✅ Code examples with copy buttons
- ✅ Performance comparisons
- ✅ Complete API reference
- ✅ Dark mode support
🆕 New Features
Framework Support
- ✅ React
- ✅ React Native
- ✅ Vue 3
- ✅ Angular
- ✅ Svelte
- ✅ Solid
- ✅ Lit
- ✅ Preact
- ✅ Vanilla JS/TS
Enhanced Error Handling
- Improved error messages with context
- Better stack traces for debugging
- Validation warnings for invalid configurations
- Helpful suggestions for common issues
Visual Regression Testing
- Built-in visual diff support
- Snapshot testing capabilities
- Integration with CI/CD pipelines
Advanced SVG Optimization
- Command optimization
- Path simplification
- Path deduplication
- Transform collapsing
- Shape conversion
- Style optimization
- Unused definition removal
📊 Package Details
Package Size:
- Compressed: 662.8 KB
- Unpacked: 2.1 MB
- Total Files: 772
What's Included:
- ✅ Complete TypeScript definitions
- ✅ 500+ sample SVG files
- ✅ Interactive test utility
- ✅ Build tool integrations
- ✅ Plugin system
- ✅ Comprehensive documentation
🔄 Migration from v3.x
Good News: v4.0.0 is 100% backward compatible with v3.x!
Automatic Config Migration
Your existing .svgerconfig.json files will work without changes. The system will automatically migrate configurations if needed.
No Breaking Changes
All v3.x APIs and CLI commands continue to work exactly as before.
Upgrade Steps
# Global installation
npm install -g [email protected]
# Project installation
npm install --save-dev [email protected]
# Verify installation
svger-cli --version # Should output: 4.0.0That's it! Your existing code and configurations will work immediately.
📚 Documentation
New Documentation
- ✅ Plugin Development Guide
- ✅ Migration Guide
- ✅ Sample SVG Testing Guide
- ✅ Integration Guide
- ✅ Framework Guide
- ✅ Quick Reference
Updated Documentation
- ✅ README with testing sections
- ✅ API reference with plugin examples
- ✅ Performance benchmarks
- ✅ Troubleshooting guide
🧪 Testing & Quality
Test Coverage
- 114 passing tests
- 82% code coverage
- E2E testing suite
- Integration tests for all frameworks
- Visual regression testing
- CI/CD pipelines
Quality Improvements
- ESLint configuration updated
- Prettier formatting enforced
- TypeScript strict mode enabled
- Comprehensive type definitions
🎯 Command-Line Enhancements
New Commands
# List available plugins
svger-cli --list-plugins
# Use multiple plugins
svger-cli --src ./icons --out ./components --plugins optimize,minify
# Interactive testing utility
test-svger --framework=vue --typescript
# Show help for test utility
test-svger --helpEnhanced Existing Commands
# Better progress indicators
svger-cli --src ./icons --out ./components --verbose
# Improved error messages
svger-cli --src ./invalid --out ./components # Clear error with suggestions
# Watch mode improvements
svger-cli --src ./icons --out ./components --watch # Faster file watching🚀 Performance Benchmarks
Real-World Performance
Processing 100 SVG files:
v3.x: ~850ms
v4.0: ~425ms (50% faster)
With plugins:
optimize: ~520ms (22% overhead)
optimize+minify: ~610ms (43% overhead)
Memory Usage:
v3.x: ~120MB
v4.0: ~85MB (29% reduction)
Bundle Size (tree-shaken):
v3.x: ~45KB
v4.0: ~32KB (29% smaller)
🔧 API Changes
New APIs
Plugin API
import { registerPlugin } from 'svger-cli';
registerPlugin({
name: 'my-plugin',
version: '1.0.0',
process: async (svg: string, options: any) => {
// Your transformation logic
return transformedSvg;
}
});Build Tool Integrations
// Webpack
import { SvgerWebpackPlugin } from 'svger-cli/webpack';
// Vite
import { svgerVitePlugin } from 'svger-cli/vite';
// Rollup
import { svgerRollupPlugin } from 'svger-cli/rollup';
// Babel
import { svgerBabelPlugin } from 'svger-cli/babel';Enhanced Existing APIs
All existing APIs remain unchanged and continue to work as expected.
🐛 Bug Fixes
- ✅ Fixed: Locked SVG files now correctly included in index.ts exports
- ✅ Fixed: Watch mode file system issues on Windows
- ✅ Fixed: TypeScript type inference for complex component props
- ✅ Fixed: Memory leaks in long-running processes
- ✅ Fixed: Edge cases in SVG path parsing
- ✅ Fixed: Race conditions in parallel processing
🔐 Security
- ✅ Zero dependencies (security audit: 0 vulnerabilities)
- ✅ Input validation for all CLI arguments
- ✅ Safe file system operations
- ✅ XSS protection in generated components
- ✅ Path traversal protection
🎨 Developer Experience
Better Error Messages
# Before (v3.x):
Error: Invalid config
# After (v4.0):
❌ Configuration Error in .svgerconfig.json
Invalid framework: "reactjs"
Did you mean one of these?
- react
- react-native
📖 See: https://github.com/faezemohades/svger-cli#frameworksImproved CLI Output
╔════════════════════════════════════════════════════════════════╗
║ SVGER-CLI Test Utility ║
║ Quick Test with Sample SVGs ║
╚═══════...