Home Ask Login Register

Developers Planet

Your answer is one click away!

Mojo80 February 2016

ASP.NET MVC Angular 2 Failed to load resource: the server responded with a status of 404 (Not Found)

I am seeing some really odd behavior with typescript imports in ASP.Net MVC using Angular 2. The following code errors at run time reporting it can't find the ng2-highcharts package, from the root - not node_modules.

All other imports work - are recognized relative from node_modules.


import {Component, View, OnInit} from 'angular2/core';
import {Ng2Highcharts} from "ng2-highcharts/ng2-highcharts";
import {CORE_DIRECTIVES, FORM_DIRECTIVES, NgClass} from 'angular2/common';
import EndPointService  from '../services/EndPointService';

//import {CHART_DIRECTIVES} from 'ng2-charts';

    selector: 'index',
    providers: [EndPointService],
    templateUrl: '/Admin.Portal/App/views/view-admin-users.html',
    directives: [Ng2Highcharts]
export class IndexComponent ...

Error: XHR error (404 Not Found) loading http://localhost/Admin.Portal/ng2-highcharts/ng2-highcharts.js(…)

run @ angular2-polyfills.js:138


  "compilerOptions": {
    "module": "system",
    "sourceMap": true,
    "noImplicitAny": true

.csproj Typescript settings

    <TypeScriptOutFile />
    <TypeScriptOutDir />


Thierry Templier February 2016

You should add a map entry for this into your SystemJS configuration. Something like this:

    map: {
      'ng2-highcharts': 'node_modules/ng2-highcharts',
    packages: {

Post Status

Asked in February 2016
Viewed 1,118 times
Voted 13
Answered 1 times


Leave an answer

Quote of the day: live life