VSCode Essentials Snippets
A collection of essentials snippets for Visual Studio Code.
Snippets are generated with snippet-generator.
Installation
- Install Visual Studio Code
- Launch Visual Studio Code
- Choose Extensions from menu
- Search for
@m-fe/vscode-snippets
- Click Install to install it
- Click Reload to reload the Code
Usage
Type part of a snippet, press enter
and the snippet unfolnds. 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
- Install Node.js and npm
- Install Visual Studio Code
Run
Clone the repo
$ git clone https://github.com/wx-chevalier/dd-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)
- Launch Visual Studio Code
- Choose Extensions from menu
- Click More > Install from VSIX...
- Select the file
@m-fe/vscode-snippets-x.x.x.vsix
- 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.
About
License
MIT
Home & More | 延伸阅读
您可以通过以下导航来在 Gitbook 中阅读笔者的系列文章,涵盖了技术资料归纳、编程语言与理论、Web 与大前端、服务端开发与基础架构、云计算与大数据、数据科学与人工智能、产品设计等多个领域:
此外,你还可前往 xCompass 交互式地检索、查找需要的文章/链接/书籍/课程;或者在 MATRIX 文章与代码索引矩阵中查看文章与项目源代码等更详细的目录导航信息。最后,你也可以关注微信公众号:『某熊的技术之路』以获取最新资讯。