asp.net Core Angular4 angular/common/http not found

Question

My question sounds similar to Cannot find the '@angular/common/http' module and Error loading @angular/common/http - angular 2 but the problem is a bit different: I am using Angular 4.3.5 and I am trying to read data from a Web API. (This API puts out JSON data and is using SignalR and .net Core). I have followed several tutorials and came up with this code for the class that will actually contact the service:

import 'rxjs/add/operator/map';

import { HttpClient, HttpEvent, HttpHandler, HttpInterceptor, HttpRequest } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Configuration } from './Configuration.js';

@Injectable()
export class DataService {
  private actionUrl: string;

  constructor(private http: HttpClient, private configuration: Configuration) {
    this.actionUrl = configuration.serviceUrl;
  }

  //public getAll<T>(): Observable<T> {
  //  return this.http.get<T>(this.actionUrl);
  //}

  public getSingle<T>(id: number): Observable<T> {
    return this.http.get<T>(this.actionUrl + id);
  }
}

@Injectable()
export class CustomInterceptor implements HttpInterceptor {

  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    if (!req.headers.has('Content-Type')) {
      req = req.clone({ headers: req.headers.set('Content-Type', 'application/json') });
    }

    req = req.clone({ headers: req.headers.set('Accept', 'application/json') });
    console.log(JSON.stringify(req.headers));
    return next.handle(req);
  }
}

Now, building this project (I am using Visual Studio 2017 Enterprise) and running a gulp task to transpile the .ts to .js works just fine, so do all the intellisense-tooltips - the IDE does recognize the existance of those things. But if I open it up in a browser (doesnt matter if firefox, edge or chrome) I get the following error: zone.js:958 GET http://localhost:3966/libs/@angular/common/bundles/common.umd.js/http 404 (Not Found)

If I edit the transpiled javascript file by hand and write common-http.umd.js there, the file is found. (This is the reason why at the top I import Configuration.js instead of Configuration - it doesnt seem to want to automatically resolve the suffix, like in some tutorials). I hope I am not too vague, since this is my first Time asking something publically. Also I was not able to find an answer in the given questions.

MPoutanen · Accepted Answer · 2017-09-04 09:02:25Z

0

Well, I found a solution, for anybody who is curious why this and similar problems exist: I had to edit my systemjs file and add this line:

'@angular/common/http': 'npm:@angular/common/bundles/common-http.umd.js',

and it works!

answered Sep 4, 2017 at 9:02

MPoutanen

1312 silver badges7 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

asp.net Core Angular4 angular/common/http not found

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related