Error in building angular app in production mode

Question

When I want to build my app with prod flag, building process will be failed because of using Http module in one of my services. It cannot resolve the parameter for this service.

here is the sample of code

import { BadInput } from './../common/bad-input';
import { NotFoundError } from './../common/not-found-error';
import { AppError } from './../common/app-error';
import { Http } from '@angular/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/map';
import 'rxjs/add/observable/throw';

@Injectable()
export class DataService {
  constructor(private endpoint: string, private http: Http) { }

  private serverUrl:string ='http://example.com/api/'
  private url=this.serverUrl+this.endpoint;

  getAll() {
    return this.http.get(this.url)
      .map(response => response.json())
      .catch(this.handleError);
  }
private handleError(error: Response) {
    if (error.status === 400)
      return Observable.throw(new BadInput(error.json()));

    if (error.status === 404)
      return Observable.throw(new NotFoundError());

    return Observable.throw(new AppError(error))
  }
}

Here is error that I have got when I using ng build --prod

ERROR in Error: Can't resolve all parameters for DataService in D:/src/app/services/data.service.ts: (?, [object Object]).
    at syntaxError (D:\node_modules\@angular\compiler\bundles\compiler.umd.js:1729:34)
    at CompileMetadataResolver._getDependenciesMetadata (D:\node_modules\@angular\compiler\bundles\compiler.umd.js:15965:35)
    at CompileMetadataResolver._getTypeMetadata (D:\node_modules\@angular\compiler\bundles\compiler.umd.js:15833:26)
    at CompileMetadataResolver._getInjectableMetadata (D:\node_modules\@angular\compiler\bundles\compiler.umd.js:15819:21)
    at CompileMetadataResolver.getProviderMetadata (D:\node_modules\@angular\compiler\bundles\compiler.umd.js:16110:40)
    at D:\node_modules\@angular\compiler\bundles\compiler.umd.js:16039:49
    at Array.forEach (<anonymous>)
    at CompileMetadataResolver._getProvidersMetadata (D:\node_modules\@angular\compiler\bundles\compiler.umd.js:15999:19)
    at CompileMetadataResolver.getNgModuleMetadata (D:\node_modules\@angular\compiler\bundles\compiler.umd.js:15654:50)
    at addNgModule (D:\node_modules\@angular\compiler\bundles\compiler.umd.js:24408:58)
    at D:\node_modules\@angular\compiler\bundles\compiler.umd.js:24419:14
    at Array.forEach (<anonymous>)
    at _createNgModules (D:\node_modules\@angular\compiler\bundles\compiler.umd.js:24418:26)
    at analyzeNgModules (D:\node_modules\@angular\compiler\bundles\compiler.umd.js:24293:14)
    at analyzeAndValidateNgModules (D:\node_modules\@angular\compiler\bundles\compiler.umd.js:24303:35)
    at AotCompiler.analyzeModulesAsync (D:\node_modules\@angular\compiler\bundles\compiler.umd.js:23937:46)

score 0 · Answer 1 · answered Mar 06 '18 at 11:30

Http has been deprecated in favor of HttpClient, so you might want to look into this: http://brianflove.com/2017/07/21/migrating-to-http-client/

In the meantime, I haven't tried this out, but you might be able to get away with continuing to use Http for a while if you aren't using the AOT option, which is switched on by default for prod builds. Give this a try:

ng build --prod --aot=false

Error in building angular app in production mode

1 Answers1