This is an Angular2 Component File Generator


To install this package globally you only need to do:

pub global activate ng2gen

this will download and install ng2gen executable into ~/.pub-cache/bin, then add ~/.pub-cache/bin to your path to directly use the executable like this

ng2gen new app

or you can use

pub global run ng2gen:new app


  • ng2gen new my_app
  • ng2gen component my_component
  • ng2gen component_inline my_component
  • ng2gen directive my_directive
  • ng2gen service my_service
  • ng2gen pipe my_pipe
  • ng2gen route home /home_path
  • ng2gen init

Create an Application

mkdir my_app && cd $_ #create directory where the app is going to live
ng2gen new my_app

This will create an Angular2 application in the folder my_app.

Use the generated app

grind serve to start your application.

The application comes with grind to help you in your development.

- `serve`
- `build`
- `test`
- `doc`
- `deploy`

Create Component

To create a component you only need to do this:

ng2gen component my_component

It will generate a component in your current directory. this should generate next files structure:

  └─ my_component
       ├─ my_component.dart
       ├─ my_component.css
       └─ my_component.html

If you execute this command inside an application generated by ng2gen, the component will be automatically include to your application under the path specified inside the angular.config.yaml file.

Create Component with Inline Template

To create a component with inline template you only need to do this:

ng2gen component_inline my_component

This command wont generate an html template, the html will be in the my_component.dart file.

Create Directive

To create a directive you only need to do this:

ng2gen directive my_directive

This should generate my_directive.dart.

Create Service

To create a service you only need to do this:

ng2gen directive my_service

This should generate my_service.dart.

Create Pipe

To create a pipe you only need to do this:

ng2gen pipe my_pipe

This should generate my_pipe.dart.

Create Route

To create a route you only need to do this:

ng2gen route home /home_path

This should generate :

       ├─ home_route_component.dart
       ├─ home_route_component.css
       └─ home_route_component.html