VSCode Essentials Snippets

A collection of essentials snippets for Visual Studio Code.

Installation

1. Install Visual Studio Code
2. Launch Visual Studio Code
3. Choose Extensions from menu
4. Search for @wx-fc/vscode-snippets
5. Click Install to install it
6. Click Reload to reload the Code

Usage

Type part of a snippet, press enter and the snippet unfolds. For snippets in markdown format you need to press ctrl+space (Windows / Linux) or cmd+space (OSX).

Angular snippets

TypeScript snippets

| Snippet | Content | | -------------------- | ---------------------------- | | ng-class | Angular Class | | ng-component | Angular Component | | ng-component-input | Angular Component with Input | | ng-directive | Angular Directive | | ng-enum | Angular Enum | | ng-guard | Angular Guard | | ng-interface | Angular Interface | | ng-module | Angular Module | | ng-pipe | Angular Pipe | | ng-service | Angular Service |

RxJS Snippets

| Snippet | Content | | --------------------- | --------------------------- | | rx-extensions | RxJS Extensions import | | rx-observable | RxJS Observable import | | rx-subject | RxJS Subject import | | rx-subject-behavior | RxJS BehaviorSubject import | | rx-subject-replay | RxJS ReplaySubject import | | rx-add-observable | RxJS add observable import | | rx-add-operator | RxJS add operator import |

HTML snipppets

| Snippet | Content | | --------------------- | ----------------------------------------- | | ng-ngFor | Angular *ngFor | | ng-ngIf | Angular *ngIf | | ng-ngModel | Angular ngModel | | ng-routerLink | Angular routerLink | | ng-routerLink-param | Angular routerLink with a route parameter | | ng-select | select control with ngModel | | ng-pre | Angular pre with json |

Continuous Integration snippets

| Snippet | Content | | ------------- | --------------------------- | | ci-appveyor | AppVeyor configuration file | | ci-circle | Circle configuration file | | ci-travis | Travis configuration file |

Git snippets

| Snippet | Content | | --------------------------- | ------------------------------- | | gitattributes | .gitattributes file with eol=lf | | gitattributes-archives | Set archives as binary | | gitattributes-documents | Set documents as binary | | gitattributes-executables | Set executables as binary | | gitattributes-fonts | Set fonts as binary | | gitattributes-graphics | Set graphics as binary | | CHANGELOG | A CHANGELOG.md template | | README | A README.md template |

Lint snippets

| Snippet | Content | | -------------- | ------------------------- | | eslint | ESLint configuration file | | eslintignore | ESLint ignore file |

Project snippets

| Snippet | Content | | -------------- | ---------------------- | | editorconfig | EditorConfig file | | npmrc | npm configuration file | | package | package.json file |

Development

Install dependencies

1. Install Node.js and npm
2. Install Visual Studio Code

Run

Clone the repo

$ git clone https://github.com/wx-chevalier/@wx-fc/vscode-snippets.git

Install vsce

$ npm install -g vsce

Build the extension file

$ vsce package

# or

$ npm run build

Install the extension from a package file (.vsix)

1. Launch Visual Studio Code
2. Choose Extensions from menu
3. Click More > Install from VSIX...
4. Select the file @wx-fc/vscode-snippets-x.x.x.vsix
5. Click Reload Now to reload the Code

Publish

Install vsce

$ npm install -g vsce

Create a publisher

$ vsce create-publisher <publisher-name>

Login

$ vsce login <publisher-name>

Publish

$ vsce publish

For more detailed information about publish: Publishing Extensions.

Author

Roberto Achar

License

MIT