Menu
Libraries |
Category

viteshot

Note: This package is no longer actively maintained. Consider using @previewjs/screenshot fa-solid fa-up-right-from-square as an alternative.

ViteShot is a fast and simple component screenshot tool built on Vite fa-solid fa-up-right-from-square. It enables developers to capture screenshots of UI components for documentation, testing, or visual regression purposes.

Key Features:

  • Supports multiple frameworks: Preact, React, Solid, Svelte, and Vue 3 (with Svelte explicitly mentioned in examples)
  • Works by exporting components from files with .screenshot.jsx/tsx/vue/svelte extensions
  • Generates screenshots in different device viewports (e.g., pixel2, laptop)
  • Stores screenshots in a structured directory (src/__screenshots__/)

Target Audience:

  • Frontend developers working with component-based frameworks
  • Teams needing visual documentation or testing capabilities
  • Projects requiring automated screenshot generation

Example Usage:

Components are exported from special screenshot files, and running viteshot generates screenshots for all defined components across different viewports. See framework-specific examples in the documentation fa-solid fa-up-right-from-square.

License: MIT

screenshotreactpreactvuesveltesolid-jsjavascript

Comments