+ +

generator-ng2component

###An angular 2 component/service generator(based on angular official release) that can generate templates for all kinds of angular 2 projects.

find in npm: https://www.npmjs.com/package/generator-ng2component ###VERSION 1.1.3

current features:
1. create a component with full standard structure (check example tree below);
2. create a service with full standard structure;
3. auto declare component in your current .module.ts file, or don't declare;
4. you decide if you want to use index.ts file

###Steps: ( Assuming you have installed node.js [tested against node v6.9.1])

install yeoman (you may need 'sudo' for permission)

npm install -g yo
install this tool

globally (may need sudo): npm install -g generator-ng2component

or just to local project: npm install --save-dev generator-ng2component
run via yeoman

yo ng2component
follow the command line instructions, and your component will be populated in designated directory.
- what do u want to generate?
  you can generate either component or service or both! default only component
  - Name for this Component & its Folder?
    default: show-message
    [notice: generator will declare this component for u only if u have corresponding .module.ts]
  - resides position?
    default under: your_project_root/webpack, enter '.' will generate in current folder
  - style sheet?
    choose from sass, css, less
  - where is your module?
    default: webpack; (type = use component's location, type - do not declare)
    [assuming your module's folder name is the same with module's name, above example will find src/app/app.module.ts, also AVOID TYPING TRAILING SLASH at the end]
  - service name?
    default: device
  - service resides position?
    default under: your_project_root/webpack/shared/services/
  - import service into new component?
    default: no
  - omit index.ts?
    default: false. it will generate index.ts for each of your cmp/service
normally, it will generate following (example) structure under your project/webpack:
```
project-root/
├── webpack/
│   └── some-module-name/
│       ├── show-message/
│       │    ├── show-message.component.ts
│       │    ├── show-message.component.spec.ts
│       │    ├── show-message.component.sass[less][css]
│       │    ├── show-message.component.html
│       │    └── index.ts
│       ├── some-module-name.module.ts (auto declare)
│       └── shared/
│            └── device/
│                ├── device.service.ts
│                ├── device.service.spec.ts
│                ├── device.ts
│                └── index.ts
```

Find more generators on yeoman: http://yeoman.io/generators/

TODO (some thoughts):

add 'generate pipe/directive/module/class/interface/e2e test' option

You're welcome to contribute (open issues, PRs)! Also, if you think this tool is helpful, please watch/star/fork me on github/npmjs and let more people know it!

developing logs

Check current version: npm view generator-ng2component version
Check newest version: npm outdated generator-ng2component
Update your local version: npm install generator-ng2component big changes happened on following versions. Feel free to use older version if you think current version contains issues.

02/25/2017 v1.1.2 generator can declare component automatically in your .module.ts now
02/24/2017 v1.1.1 generator can declare component automatically for your app.module.ts now
02/22/2017 v1.0.9 capable to omit generating index.ts now
11/12/2016 v1.0.6 generator is capable to import service automatically into component now
11/09/2016 v1.0.3 now you have stable service generator
11/8/2016 v0.0.11 fixed ts linting warnings
11/07/2016 v0.0.7 added global colors/fonts ref to scss
11/01/2016 v0.0.5 first stable version, can only generate component

gion / generator-ng2component Goto Github PK