Error when using Highcharts with Angular 2 -

i using angular2-highcharts component.ts file below:

import { component } '@angular/core'; import { chart_directives } 'angular2-highcharts';  @component({     selector: 'emotions',     templateurl: 'app/components/emotions/emotions.component.html',     providers: [emotionsservice],     directives: [chart_directives]  }) export class emotionscomponent {     constructor(private emotionsservice: emotionsservice) {         this.options = {             title : { text : 'simple chart' },             series: [{                 data: [29.9, 71.5, 106.4, 129.2],             }]         };     }     options: highchartsoptions; } 

in template file

<chart [options]="options"></chart> 

package.json file has following alongwith other angular dependencies:

"dependencies": {     "angular2-highcharts": "0.2.1"   }, 

i have run npm install , angular2-highcharts has been install in node_modules folder.

i following error:

zone.js:1274 http://localhost:3000/angular2-highcharts 404 (not found) 

i tried change systemjs.config.js file

map: {             'angular2-highcharts': 'node_modules/angular2-highcharts' } 

however, started getting following error:

zone.js:1274 http://localhost:3000/node_modules/angular2-highcharts/ 404 (not found) 

how can resolve problem?

edit

i added in system.config.js file

map:{ 'angular2-highcharts': 'node_modules/angular2-highcharts/node_modules/highcharts/index.js', } 

i following error

zone.js:1274 http://localhost:3000/node_modules/angular2-highcharts/dist/index 404 (not found) 

i tried changing index -> index.js. works on gives same error on other js files.

i did following things:

systemjs.config.js

map: {             // our app within app folder             app: 'app',             'angular2-highcharts': 'node_modules/angular2-highcharts',             'highcharts': 'node_modules/highcharts' }  packages: {             app: {                 main: './main.js',                 defaultextension: 'js'             },             rxjs: {                 defaultextension: 'js'             },             'angular2-highcharts': {                 main: './index.js',                 defaultextension: 'js'             },             'highcharts': {                 defaultextension: 'js'             } } 

remove directives components file

add following in app.module.ts file

import { chart_directives } 'angular2-highcharts'; @ngmodule({     declarations: [         chart_directives     ], })