cannot find module '@angular/http'?

Question

I added the following property to my systemjs.config.js map object in my Angular 2 app:

'@angular/http': 'https://npmcdn.com/@angular/http'

When I ctrl-click on the url it attempts to download a js file. However, when I try to import from '@angular/http' at the top of my service.ts, the compiler returns the error "Cannot find module '@angular/http'.`"

Is there an additional step that I'm missing in order for this module to be recognized and usable by my angular app? I'm using Angular version 2.0.0-rc.4.

I put systemjs.config.js in this plunk: plnkr.co/edit/mGCDGuYmyzv1ykJl7HtY?p=catalogue — user6604655
– user6604655, Commented Jul 21, 2016 at 17:17

Rohit Bagjani · Accepted Answer · 2020-08-02 20:19:06Z

127

run this in terminal:

npm install @angular/http@latest

Update for Angular 5+ versions:

import {HttpClientModule} from '@angular/common/http'
import {HttpClient} from '@angular/common/http'

instead of HttpModule and Http respectively.

edited Aug 2, 2020 at 20:19

answered Feb 8, 2019 at 12:23

Rohit Bagjani

1,3143 gold badges11 silver badges14 bronze badges

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

1 Comment

Jeremy Thille Over a year ago

http was deprecated in Angular 5 and then removed. For Angular >= 4.3, HttpClient must be used (see @DevGaud's answer below)

Dev Gaud · Accepted Answer · 2019-07-04 07:48:33Z

32

The entire @angular/http package has been removed. Use @angular/common/http. so instead of importing this one

'@angular/http'

use this

'@angular/common/http'

for further information about other changes go to Angular- Deprecated APIs and Features

edited Jul 4, 2019 at 7:48

answered Jul 4, 2019 at 7:23

Dev Gaud

8647 silver badges10 bronze badges

4 Comments

Jeremy Thille Over a year ago

It worked, but also I had to change import { Http } to import { HttpClient } in Angular 8. Final syntax : import { HttpClient } from '@angular/common/http'

Dev Gaud Over a year ago

Yeah, they also updated the 'Http' class to 'HttpClient'. Now I think about it, my answer could have more upvotes. Anyway thanks for giving the final syntax, people might find it helpful.

Allie Moosa Over a year ago

Thanks, it worked but I used: import { HttpClientModule} from '@angular/common/http' since I wanted to use it in NgModule({ imports})

Akhachkhouch Over a year ago

npm install @angular/common@latest, Use this command

tony2tones · Accepted Answer · 2018-12-09 12:10:16Z

8

Have you tried adding

"@angular/http": "^7.1.1",

to your package.json file? Once you do run npm install and you should be golden.

answered Dec 9, 2018 at 12:10

tony2tones

1,6801 gold badge19 silver badges21 bronze badges

Comments

Amila Weerasinghe · Accepted Answer · 2020-01-22 08:46:22Z

8

1.This worked for me.Try installing latest angular http

npm install @angular/http@latest

2.Also you can try use

'@angular/common/http'

instead of this

'@angular/http'

The reason for the second option is

The following APIs have been removed starting with version 8.0.0:

PACKAGE API REPLACEMENT NOTES

@angular/http

All exports replaced with

@angular/common/http

answered Jan 22, 2020 at 8:46

Amila Weerasinghe

85911 silver badges11 bronze badges

Comments

Prateek Gupta · Accepted Answer · 2020-06-21 13:34:52Z

8

import { HttpClient } from '@angular/common/http';

instead of

import { Http } from '@angular/http';

And in app.module.ts :

import { HttpClientModule } from '@angular/common/http';

edited Jun 21, 2020 at 13:34

Prateek Gupta

2,8182 gold badges21 silver badges34 bronze badges

answered Jun 20, 2020 at 7:35

Akib Sayyed

991 silver badge3 bronze badges

Comments

Mayur Saner · Accepted Answer · 2019-06-05 06:27:51Z

7

You need to have latest version of http. Try the following command in terminal, hope this will solve your problem...

npm install @angular/http@latest

answered Jun 5, 2019 at 6:27

Mayur Saner

4625 silver badges11 bronze badges

Comments

Chetan Pardhi · Accepted Answer · 2019-10-04 11:34:33Z

5

I use below command & "cannot find module '@angular/http'" issue get solved.

npm install @angular/http@latest

answered Oct 4, 2019 at 11:34

Chetan Pardhi

511 silver badge2 bronze badges

Comments

Dip · Accepted Answer · 2019-07-24 07:45:22Z

3

Just node command prompt, go to project folder and run

npm install @angular/http@latest

If there is any severity found as sometimes it show after you install, just use

npm audit fix

answered Jul 24, 2019 at 7:45

Dip

7067 silver badges9 bronze badges

Comments

Sandeep Shinde · Accepted Answer · 2019-09-27 06:15:55Z

3

use this command for instaling http modules
npm install @angular/http@latest

answered Sep 27, 2019 at 6:15

Sandeep Shinde

312 bronze badges

Comments

Mebin Joe · Accepted Answer · 2019-07-18 10:52:15Z

2

You can try to install by running below command

npm i @angular/http

edited Jul 18, 2019 at 10:52

Mebin Joe

2,2394 gold badges19 silver badges22 bronze badges

answered Jul 18, 2019 at 8:53

Seda Hayrapetyan

3542 silver badges5 bronze badges

Comments

Jm Paunlagui · Accepted Answer · 2020-04-26 16:27:52Z

2

Try this, it works! HttpClientModule

*import { HttpClientModule } from '@angular/common/http';*

@NgModule({
  declarations: [
    AppComponent,
  ],
  imports: [
    BrowserModule,
    *HttpClientModule,*
    ReactiveFormsModule,
    AppRoutingModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

It worked in my code

answered Apr 26, 2020 at 16:27

Jm Paunlagui

211 silver badge1 bronze badge

Comments

Mohamed A M-Hassan · Accepted Answer · 2020-05-17 11:55:38Z

2

The entire @angular/http package has been removed. Use @angular/common/http instead.

Replace HttpModule with HttpClientModule (from @angular/common/http) in each of your modules.

So you can import like: import { HttpClient } from '@angular/common/http';

for more info, read this: https://angular.io/guide/deprecations#angularhttp

answered May 17, 2020 at 11:55

Mohamed A M-Hassan

4534 silver badges10 bronze badges

Comments

Shaun Emslie · Accepted Answer · 2020-05-30 14:49:42Z

2

@angular/http is deprecated.

Try:

import { HttpClient } from '@angular/common/http';

refer to https://angular.io/guide/deprecations#angularhttp for more info.

If you insist on using @angular/http try:

npm install @angular/http@latest

import { Http } from '@angular/http';

answered May 30, 2020 at 14:49

Shaun Emslie

211 bronze badge

Comments

nipun-kavishka · Accepted Answer · 2020-05-30 16:59:24Z

2

@angular/http is deprecated

try this:

import { HttpClient } from "@angular/common/http";

in the constructor:

 constructor(public http: HttpClient) { }

answered May 30, 2020 at 16:59

nipun-kavishka

9221 gold badge13 silver badges22 bronze badges

Comments

Sanket · Accepted Answer · 2016-07-22 03:29:06Z

0

CDN path is - https://npmcdn.com/@angular/[email protected]/

By default, systemjs.config.js looks for index.js in this path.

Refer this plunker example - https://angular.io/resources/live-examples/quickstart/ts/plnkr.html

Also, make sure while importing use below syntax-

import { Http } from '@angular/http';

See if this helps.

edited Jul 22, 2016 at 3:29

answered Jul 21, 2016 at 17:35

Sanket

20.2k10 gold badges74 silver badges84 bronze badges

3 Comments

user6604655 Over a year ago

I tried including the cdn path you provided for the http ref I included in my config file. I tried it with and without the trailing slash but I still got the same errors. I did a file compare between my config file and the one you provided on your plunk but the only diffs were that http was removed from your map and the routerVer minor version was different.

user6604655 Over a year ago

Here's a plunk with a full working version of a service that angular.io provides online: angular.io/resources/live-examples/server-communication/ts/… My config.js is the same as the one provided in the example plunk. Therefore, my build failure [Cannot find module '@angular/http'] does not appear to be due to gaps in my config file. I even copied/pasted the import from the example into my service.ts to account for possible typos or other weirdness. I checked the output console of the build and no additional info was returned. Any ideas for additional troubleshooting?

Sanket Over a year ago

can you please share your complete example in plunker? so that we can look any typo or any other mistakes.

Joundill · Accepted Answer · 2021-02-13 03:20:14Z

0

npm install @angular/[email protected]

version 2.1.2 is required

edited Feb 13, 2021 at 3:20

Joundill

7,84113 gold badges40 silver badges54 bronze badges

answered Feb 12, 2021 at 22:49

loay Afaneh

1

Collectives™ on Stack Overflow

cannot find module '@angular/http'?

16 Answers 16

1 Comment

4 Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

3 Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

16 Answers 16

1 Comment

4 Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

3 Comments

Comments

Related