1.9.0 • Public • Published

Yeoman Generator for Alfresco Angular 2 Component

yeoman logo

Build Status Coverage Status license downloads stats npm version


See the following page for an introduction to the Alfresco Application Development Framework.


Before you start using this development framework and the generator, make sure you have installed all required software and done all the necessary configuration, see this page.

Installing Yeoman and the Component Generator

First, install Yeoman:

npm install -g yo

Then the Alfresco Component Generator:

npm install -g generator-ng2-alfresco-component

Generating a new component project

First, move into the folder where you want create your component.

yo ng2-alfresco-component

alfresco generator

Which will generate project structure similar to the following:

├── assets/
│   └── license_header.txt
├── demo/
│   ├── src/
│   │   └── main.ts
│   ├── .editorconfig
│   ├── .gitignore
│   ├── index.html
│   ├── package.json
│   ├──
│   ├── systemjs.config.js
│   ├── tsconfig.json
│   ├── tslint.json
│   └── typings.json
├── src/
│   ├── my-element.component.spec.ts
│   └── my-element.component.ts
├── .editorconfig
├── .gitignore
├── gulpfile.ts
├── index.ts
├── karma-test-shim.js
├── karma.conf.js
├── package.json
├── tsconfig.json
├── tslint.json
└── typings.json

You will need to run the following scripts in the generated folder:

npm install
npm run build

Alternatively you can use generator with install switch to trigger automatic installation of dependencies via npm install script:

yo ng2-alfresco-component --install

Optinally you can use npm run link script to locally link ADF libraries if necessary.

npm scripts

Command Description
npm run build compiles component
npm run build:w compiles component, watches for changes and recompiles if needed
npm run test compiles, runs and watches the karma unit tests (console version)
npm run test-browser compiles, runs and watches the karma unit tests (browser version)
num run coverage runs unit tests, generates and opens code coverage report in browser
npm run link Link ADF components locally by means of npm link
npm run build.umd Build the UMD bundle package

Running demo

If you have answered Yes for the generator question Do you want a demo project to be generated? you will get an additional demo project in the demo folder.

You will need installing npm dependencies for the generated demo project separately:

cd demonpm run test
npm install
npm run start

Optinally you can use npm run link script to locally link ADF libraries if necessary.

Contributing to the generator

  1. Fork it!
  2. Create your feature branch: git checkout -b my-new-feature
  3. Make some changes
  4. Commit your changes: git commit -m 'Add some feature'
  5. Push to the branch: git push origin my-new-feature
  6. Submit a pull request

To contribute to the existing code base add test cases to cover the new behaviour, and make sure all the existing tests are still green.

To test the generator run:

npm run test

Debugging generator

# OS X / Linux 
DEBUG=yeoman:generator yo ng2-alfresco-component
# Windows 
set DEBUG=yeoman:generator & yo ng2-alfresco-component

More on debugging generators.

Advanced options

yo ng2-alfresco-component --alfresco

Typically used for internal purposes and adds the following extras to the generated project structure:

  • adds Alfresco license headers to all code files
  • configures component package.json with additional license checker configurations (devDependencies, scripts, etc.)


For detailed changelog, see Releases.


Contributor GitHub profile Twitter profile
Eugenio Romano Eugenio Romano @RomanoEugenio
Denys Vuika Denys Vuika @denisvuyka
Mario Romano Mario Romano @MagemelloMario

See all contributors


Apache Version 2.0


npm i generator-ng2-alfresco-component

DownloadsWeekly Downloads






Last publish


  • alfresco