John Papa

AngularJS Snippets for Sublime, Visual Studio and WebStorm

John Papa -

It is nice to have some help to follow your own patterns. That is why I created some simple file templates and snippets that follow my AngularJS Style Guidelines. You can find a series of file templates and snippets for the various editors and IDEs that I use. These include Sublime, Visual Studio and WebStorm. (I may add others over time).

Here are templates and/or snippets for some of the web development editors and IDEs.

Sublime Text

AngularJS snippets that follow these styles and guidelines.

  1. Download the Sublime Angular snippets
  2. Place it in your Packages folder
  3. Restart Sublime

In a JavaScript file type these commands followed by a TAB:

ngcontroller // creates an Angular controller
ngdirective // creates an Angular directive
ngfactory // creates an Angular factory
ngmodule // creates an Angular module

Visual Studio

AngularJS file templates that follow these styles and guidelines can be found at SideWaffle

  1. Download the SideWaffle Visual Studio extension (vsix file)
  2. Run the vsix file
  3. Restart Visual Studio

WebStorm

AngularJS snippets and file templates that follow these styles and guidelines. You can import them into your WebStorm settings:

  1. Download the WebStorm AngularJS file templates and snippets
  2. Open WebStorm and go to the File menu
  3. Choose the Import Settings menu option
  4. Select the file and click OK

In a JavaScript file type these commands followed by a TAB:

ng-c // creates an Angular controller 
ng-f // creates an Angular factory 
ng-m // creates an Angular module