Question

我的应用程序具有简单的Logger服务。

@Injectable({
  providedIn: 'root'
})
export class Logger {
  log() {
    console.log()
  }
}

该服务已注入应用程序中的其他服务和组件中。

检查生产构建输出，我看到许多对logger.log()的调用，这增加了包的大小。

我只需要在开发环境中使用Logger。如何从生产构建输出中完全删除Logger服务以及所有log（）函数调用？

Answer 1

除了在所有服务中添加记录器之外，您还可以在所有服务之间使用拦截器。

logger.interceptor.ts

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

@Injectable()
export class LoggerInterceptor implements HttpInterceptor {

  constructor() {
  }

  /**
   * @param {HttpRequest<any>} req
   * @param {HttpHandler} next
   * @returns {Observable<HttpEvent<any>>}
   */
  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    console.log(req);
  }
}

然后在此example之后，您可以在您的 app.module.ts 中使用useFacotry（甚至可能以相同的方式使用useClass）来在您导入的内容之间切换。这是未经测试的代码，因此您可能需要花一点时间才能使其工作。

app.module.ts

import {LoggerInterceptor} from './path/to/realm.interceptor';
import {environment} from './environments/environment';

...

providers: [
    {
      provide: HTTP_INTERCEPTORS,
      multi: true,
      useClass: () => {
        if (!environment.production) {
          return new loggerService();
        }
      }
    },
]

如何从生产版本中完全删除服务？

1 个答案: