Skip to main content

Overview

View Exports SVG is a Visual Studio Code extension that helps developers discover, preview, and manage SVG component libraries in modern front-end projects.

In projects with growing icon sets, understanding what SVG components exist and how they are structured can become difficult. View Exports SVG provides a unified, editor-native interface to explore SVG components without leaving VS Code.

What It Does

The extension scans your workspace and extracts exported SVG components from:

  • JavaScript (.js)
  • TypeScript (.ts)
  • JSX / TSX (.jsx, .tsx)

It uses Babel AST traversal to accurately detect SVG components in React, Preact, and other JSX-based frameworks.

Key Capabilities

View Exports SVG provides tools for working with SVG components at scale:

  • Workspace-wide Discovery Scans the entire project and lists all exported SVG components.

  • Interactive DevTools Panel A dockable panel for previewing components and accessing related actions.

  • Real-time Playground Edit component properties in an embedded editor and preview changes instantly.

  • Component Metadata Displays export type, animation detection, and usage status.

  • Multi-language Support Interface available in over 15 languages.

note

View Exports SVG is designed to work with both small projects and large icon libraries, adapting to different project structures and export patterns.


📦 Release History

View Exports SVG evolves continuously with new features, performance improvements, and bug fixes.

You can track all changes, releases, and version history in the Changelog.