Skip to content

Editing VS Code extension manifests (package.json) can be tedious. With complex contribution points, activation events, and configuration schemas, it's easy to make mistakes or forget required fields. VSIX Manifest Designer provides a visual interface to edit these files with confidence!

License

Notifications You must be signed in to change notification settings

CodingWithCalvin/VSC-VsixManifestDesigner

VSIX Manifest Designer Logo

VSIX Manifest Designer

🎨 A visual designer for VS Code extension manifest files

License Build Status

Marketplace Version Installs Downloads Rating


πŸ€” Why?

Editing VS Code extension manifests (package.json) can be tedious. With complex contribution points, activation events, and configuration schemas, it's easy to make mistakes or forget required fields. VSIX Manifest Designer provides a visual interface to edit these files with confidence.

✨ Features

  • 🎯 Visual Editor - Edit your extension manifest visually instead of raw JSON
  • πŸ”„ Live Sync - Changes sync bidirectionally between the designer and the underlying JSON
  • 🎨 Theme Integration - Seamlessly integrates with your VS Code theme
  • πŸ“‹ Non-Destructive - Open alongside the standard JSON editor; your choice

πŸ–ΌοΈ Screenshots

Getting Started

Open With Context Menu
Right-click package.json and select "Open With..."

Select Editor
Choose "Extension Manifest Designer"

Editor Views

Metadata View
Metadata - Basic extension information

Activation View
Activation - Entry points and activation events

Compatibility View
Compatibility - VS Code version and runtime settings

Dependencies View
Dependencies - Extension dependencies and packs

Documentation View
Documentation - Repository, badges, and links

Commands View
Commands - Command palette contributions

Configuration View
Configuration - Extension settings schema

Menus View
Menus - Menu and context menu contributions

Keybindings View
Keybindings - Keyboard shortcuts

View Containers View
View Containers - Activity bar and panel containers

Views View
Views - Tree views and webviews

Themes View
Themes - Color, icon, and product icon themes

Languages View
Languages - Language contributions

Grammars View
Grammars - TextMate grammar definitions

Snippets View
Snippets - Code snippet contributions

Advanced View
Advanced - Localization and lifecycle scripts

πŸ› οΈ Installation

Visual Studio Marketplace

  1. Open VS Code
  2. Go to Extensions (Ctrl+Shift+X / Cmd+Shift+X)
  3. Search for "VSIX Manifest Designer"
  4. Click Install

Manual Installation

Download the latest .vsix file from the Releases page and install via:

code --install-extension vsix-manifest-designer-*.vsix

πŸš€ Usage

  1. Open a folder containing a VS Code extension
  2. Right-click on package.json in the Explorer
  3. Select "Open With..."
  4. Choose "Extension Manifest Designer"
  5. Edit your manifest visually πŸŽ‰

🀝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

Development Setup

  1. Clone the repository
  2. Run npm install
  3. Press F5 to launch the Extension Development Host
  4. Make changes and test in the development host

πŸ“„ License

This project is licensed under the MIT License - see the LICENSE file for details.


πŸ‘₯ Contributors

CalvinAllen


Made with ❀️ by Coding With Calvin

About

Editing VS Code extension manifests (package.json) can be tedious. With complex contribution points, activation events, and configuration schemas, it's easy to make mistakes or forget required fields. VSIX Manifest Designer provides a visual interface to edit these files with confidence!

Topics

Resources

License

Code of conduct

Contributing

Stars

Watchers

Forks

Sponsor this project

Contributors 2

  •  
  •