I can't install Onsen UI 2 + Angular 2

[davidNieves]

I all and thanks in advance.

I have a problem with angular 2 + onsen ui 2. I follow this steps:

1. Install Angular 2 with Node.js following the official documentation. All perfect. https://angular.io/docs/ts/latest/quickstart.html

2. After I follow onsen ui 2 install from official documentation: https://onsen.io/v2/docs/guide/angular2/index.html

   2.1.- Run command to install onsen ui + onsen ui 2 "npm install onsenui angular2-onsenui" now in my node_modules folder has 2 news folder "onsenui" and "angular2-onsenui".
   
   2.2.- Modified app.component.ts to include onsen ui directives:
   I follow this of section "Loading Onsen UI in Angular 2" of official documentation of onsen ui 2.
   2.3.- Also changed my systemjs.config.js to "map" onsen ui:
   

3.- When I start app I get this errors:

What did do wrong here? I take a few days with this and I can't find solution! please help!!

[IliaSky]

Hi @davidNieves.

First I would like to mention that (as you may have noticed in our issue template) - we like using github issue for bugs and feature requests only. Questions should be asked in either stackoverflow.com/tags/onsen-ui or community.onsen.io.

But anyway here's your answer:

There are 2 things which should be noted here:

1. Make sure that you installed onsen 2 instead of onsen 1. We recommend installing onsen ui with npm install onsenui@latest.

2. Since you are using systemjsthere is one more line which you need to add in order to import angular2-onsenui properly - mentioning the location of the main file of the module, as well as the default extension.

   That line would be
   packages['angular2-onsenui'] = { main: 'dist/src/angular2-onsenui.js', defaultExtension: 'js' }

   We prefer using webpack as importing things with it is a little bit easier. It takes the main file's location from package.json automatically and is also able to import the other files without specifying the extension. For example if we move the main file to another location with webpack nothing would break, whereas with systemjs you would need to update the location manually.

Anyway make sure you confirm these 2 points and you're good to go.