Search code examples
javascriptangularwebpackangular7

Uncaught Error: Can't resolve all parameters for LoginComponent: (?) in Angular 7 and webpack

I am working in angular 7. I am getting an error while compiling. I have checked the circular dependancy, Injectable() decorator. There is no unused dependancy. I have used @Injectable() in my service. For your information, i am using mac. I can't find any solution.

My code is given bellow:

auth.service.ts

    import { Router } from '@angular/router';
    import { Injectable } from '@angular/core';
    import { Observable } from 'rxjs';
    import { HttpErrorResponse } from '@angular/common/http';
    import { HttpService } from '../common/modules/http-with-injector/http.service';
    import { UserData } from '../common/modules/auth/auth.module';
    import { dcrypt } from '../common/_classes/functions';

    @Injectable()
    export class AuthService {
      user: any;
      constructor(
        private router: Router,
        private http: HttpService,
      ) {}
    }

component.ts

import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import { AuthService } from '../auth.service';
import * as $ from 'jquery';
import { Router } from '@angular/router';
import { ScriptLoaderService } from 'src/app/common/script-loader.service';
import { AlertService } from 'src/app/common/modules/alert/alert.service';
import { Helpers } from 'src/app/common/helpers';

@Component({
  selector: 'app-login',
  templateUrl: './login.component.html',
  styleUrls: ['./login.component.css']
})
export class LoginComponent implements OnInit {
  model: any = {
    email: '',
    password: ''
  };
  loading = false;
  @ViewChild('hasAlert', { static: true }) alertContainer: ElementRef;

  constructor(
    private _script: ScriptLoaderService,
    private router: Router,
    private alert: AlertService,
    private authService: AuthService,
  ) {
    this.getSettings();
  }
}

Please help me to solve the problem.

Solution

  • This error may cause of Metadata issue:

    TypeScript includes experimental support for emitting certain types of metadata for declarations that have decorators.

    To enable this experimental support, you must set the emitDecoratorMetadata compiler option either on the command line or in your tsconfig.json:

    Command Line:

    tsc --target ES5 --experimentalDecorators --emitDecoratorMetadata

    tsconfig.json:

    {
 "compilerOptions": {
    "target": "ES5",
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true
    }
 }