snippets icon indicating copy to clipboard operation
snippets copied to clipboard

Supercharge your Snippets in VS Code — Manage your code snippets without quitting your editor.

Snippets for VSCode

Code snippets are great additions to anyone who wants to save time while developing. They make it easier to enter repeating code, such as loops, complex HTML structures or reusable methods.

Visual Studio Code already has great support for snippets, including snippets appearance in IntelliSense (Ctrl+Space), tab-completion, as well as a dedicated snippet picker (Insert Snippet in the Command Palette).

This extension takes snippets to another level bringing new features which will improve managing code snippets.

Table of contents

  • Features
    • Create Snippet
    • Organize Snippets
    • Open Snippet
    • Edit Snippet
    • Sync your Snippets
  • Installation
  • Known Issues
  • Release Notes
  • Feedback
  • Credits

Features

Create Snippet

You can easily create a snippet from your open editor in VSCode.

Create Snippet

You can add code snippet directly from outside VSCode via your clipboard.

Create Snippet from Clipboard

If you have a command in mind, just add it manually.

Create Snippet Manually

Organize Snippets

You have the flexibility to reorder your snippets, there is no default order.

Reorder Snippets

Open Snippet

Add your snippet with a single click.

Open Snippet

You're a keyboard guru ? Open your snippets using magic key > or using IntelliSense (Ctrl+Space).

Open Snippet using Suggestions

Your snippet has variables ? No worries.

Open Snippet with Variables

Lot of snippets ? Use Command Palette to quickly search for the wanted one.

Open Snippets from Command Palette

You have some commands for terminal ? Open them directly.

Open Snippet in Terminal

Edit Snippet

Edit your snippet easily and benefit from support of VSCode built-in Snippet Syntax.

Edit Snippet

Sync your Snippets

Sync your Snippets with VSCode

Experimental feature feel free to file a bug as this is still an experimental change.

Starting with version 2.0 and up, Snippets supports backup using VSCode Settings Sync feature. This means that you will no longer need to deal with snippets location in your file local machine. Your snippets will be saved alongside your VSCode data no matter your operating system.

Check the docs to know more about Settings Sync feature and how to use it.

Note: Settings Sync is still a VSCode preview feature.

Sync your Snippets with Version Control System

A huge number of users use a VCS (e.g Git) and they may want to bind snippets to a specific project (e.g share project specific snippets with team members). This is doable using the option snippets.useWorkspaceFolder. Once this option is enabled, the extension will read/write snippets from/in .vscode/snippets.json if that file is available (extension will ask to create the file for you the first time you enable the option).

Note: Enabling the option snippets.useWorkspaceFolder will omit synchronization via Settings Sync. You'll be responsible of backing up the file .vscode/snippets.json using your favorite VSC.

Enjoy!

Installation

Open VSCode and type ctrl+P, type ext install tahabasri.snippets.

Known Issues

  • With version 1.2 and bellow, there was an issue regarding permissions when trying to change snippets location. In Windows in particular, changing location to some restricted folders (e.g C:\\) caused the extension to rollback to default path. This is due to lack of permissions on files from within VSCode itself.

We recommend upgrading to version 2+ to fix such issues.

Permissions issue

Release Notes

Check CHANGELOG.md for full release notes.

Feedback

Credits