Angular 5: ERROR in src/app/app.module.ts(24,24): error TS2307: Cannot find module 'https'

Question

I am getting an error when running "ng serve" for Angular. I have seen some other issues with the same message number but they are for Angular 2, Angular 4.x, etc.

What can I do to resolve the problem?

Below is the app.module.ts file

TIA

UPDATE-STILL HAVING THE PROBLEM

I believe I marked the message resolved too early :) I am getting the following errors when running `ng serve` under Angular 5:

ERROR in src/app/app.module.ts(24,24): error TS2307: Cannot find module 'https'.
src/app/pages/auth-admin/admin-model/user.ts(1,35): error TS2307: Cannot find module 'constants'.
src/app/pages/auth-admin/admin-services/admin-services/admin-services.service.ts(5,25): error TS2307: Cannot find module 'cluster'.
webpack: Failed to compile.

If I save a document, then the "webpack" compiles. I had thought about upgrading the system (in hopes that this would resolve the problem) but am not sure if that would be the case.

Any assistance on how to come about the issue is appreciated.

TIA

UPDATE - FOUND OUT WHAT THE PROBLEM WAS Basically, I did not understand the error message :-|

I thought it had something to do with my version of Angular 5 - so - I upgraded using the following info:

SOURCE: https://github.com/angular/angular-cli/issues/4391

[updating globally]
npm uninstall -g angular-cli
npm cache clean
npm install -g @angular/cli@latest

[ updating the project ]
rm -rf node_modules dist
npm uninstall --save-dev angular-cli
npm install --save-dev @angular/cli@latest
npm install
ng update

I tried to start the server with ng serve

The message I got was:

ERROR in src/app/app.module.ts(24,24): error TS2307: Cannot find module 'https'.
src/app/pages/auth-admin/admin-model/user.ts(1,35): error TS2307: Cannot find module 'constants'.
src/app/pages/auth-admin/admin-services/admin-services/admin-services.service.ts(5,25): error TS2307: Cannot find module 'cluster'.

I actually checked the files that were mentioned in the error message and saw something like this (which was in app.module.ts )

import { Server } from 'https';

as an example.

The same applied to the other files. I do not know how they got there - but - I commented them out and the server started. So again, I did not really get the message. New to Angular though.

TIA

app.module.ts

    import { BrowserModule } from '@angular/platform-browser';
    import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
    import { NgModule } from '@angular/core';

    import { AgmCoreModule } from '@agm/core';
    import { CalendarModule } from 'angular-calendar';

    import { routing } from './app.routing';
    import { AppSettings } from './app.settings';

    import { AppComponent } from './app.component';
    import { NotFoundComponent } from './pages/errors/not-found/not-found.component';


    import { FormsModule } from '@angular/forms';


    import { AdminServicesService } from './pages/auth-admin/admin-services/admin-services/admin-services.service';
    import { Server } from 'https';


    import 'rxjs/add/operator/switchMap';
    import 'rxjs/add/operator/map';
    import 'rxjs/add/operator/shareReplay';


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


@NgModule({
  declarations: [
    AppComponent,
    NotFoundComponent
  ],
  imports: [
    HttpClientModule,
    BrowserModule,
    FormsModule,
    BrowserAnimationsModule,
    AgmCoreModule.forRoot({
      apiKey: 'AIzaSyDe_oVpi9eRSN99G4o6TwVjJbFBNr58NxE'
    }),
    CalendarModule.forRoot(),
    routing
  ],
  providers: [ AppSettings, AdminServicesService ],
  bootstrap: [ AppComponent ]
})
export class AppModule { }

currently running

Angular CLI: 1.6.1
Node: 8.9.4
OS: win32 x64
Angular: 5.1.1
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cli: 1.6.1
@angular-devkit/build-optimizer: 0.0.38
@angular-devkit/core: 0.0.23
@angular-devkit/schematics: 0.0.42
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.1
@schematics/angular: 0.1.13
typescript: 2.4.2
webpack: 3.10.0

Answer 1

Errors like these error TS2307: Cannot find module sometimes occur when you change the app structure add/delete/move components and just keep using hot reload. In cases like that you can try to stop the serving (CTRL+C) and restart it (ng-serve).

Check that all the modules that Angular CLI is referring to are present.

Also, this error (error TS2551: Property 'subscribe' does not exist on type 'Subscription') has nothing to do with Angular CLI, you are apparently just trying to call .subscribe on something that returns a Subscription (ie has already called .subscribe ).

Answer 2

In terminal I have executed this command and it installed http module.

 npm install --save @angular/http

Note: Restart Server after this command successfully installs http module.

Answer 3

In case someone struggling for "error TS2306" , basically in Angular7, it's not required to declare your service, simply import it in the component.

 - Service-A.ts
 - Component-A.ts
 - Module-A.ts // don't need to declare or export Service-A.ts here. 

but make sure to import HttpClientModule is a must if you're interacting with data using http

I've imported HttpClientModule to the module and the error gone.

Answer 4

I had a similar problem. My error was:

ERROR in src/app/app-routing.module.ts:19:34 - error TS2304: Cannot find name 'CheckoutComponent'.

19   { path: 'checkout', component: CheckoutComponent},

I think it wasn't recognizing the new component I had just added. There was a refresh problem.

Commenting out the line { path: ... , running ng serve, then uncommenting the line again and running ng serve again helped get rid of the message.

Answer 5

If you just created the app and you are new to angular, make sure you first check your app folder whether this file exists: app-routing.module.ts

If it does not, copy the command below and run it:

ng generate module app-routing --flat --module=app

You might see a few errors but they are easy to resolve by searching google and stack overflow.