Angular Upgrade 8 to 11 version Error : Class extends value undefined is not a constructor or null答案

【问题标题】：Angular Upgrade 8 to 11 version Error : Class extends value undefined is not a constructor or nullAngular Upgrade 8 to 11 version Error : Class extends value undefined is not a constructor or null
【发布时间】：2021-08-06 13:34:53
【问题描述】：

我正在将 Angular 8 升级到 11。我遇到以下问题：

Uncaught TypeError: Class extends value undefined is not a constructor or null
    at Module.4lR8 (main.js:sourcemap:59)
    at __webpack_require__ (runtime.js:sourcemap:80)
    at Module.etL5 (main.js:sourcemap:3115)
    at __webpack_require__ (runtime.js:sourcemap:80)
    at Module.A3+G (main.js:sourcemap:1039)
    at __webpack_require__ (runtime.js:sourcemap:80)
    at Module.ct+p (main.js:sourcemap:3011)
    at __webpack_require__ (runtime.js:sourcemap:80)
    at Module.ZAI4 (main.js:sourcemap:2897)
    at __webpack_require__ (runtime.js:sourcemap:80)

请为我提供上述问题的解决方案。

Angular 版本详情：

Angular CLI: 11.2.12
Node: 10.16.3
OS: win32 x64

Angular: 11.2.13

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1102.12
@angular-devkit/build-angular   0.1102.12
@angular-devkit/core            11.2.12
@angular-devkit/schematics      11.2.12
@angular/cdk                    11.2.12
@angular/cli                    11.2.12
@angular/http                   7.2.15
@schematics/angular             11.2.12
@schematics/update              0.1102.12
ng-packagr                      11.0.0
rxjs                            6.6.7
typescript                      4.0.2

【问题讨论】：

提供更多细节，有没有扩展的类？？
这能回答你的问题吗？ TypeError: Class extends value undefined is not a function or null
@Injectable() 导出类 UserService 扩展 ServiceBase { } 导出抽象类 ServiceBase { }
在 Angular 8 中同样的事情工作正常
指定代码中的所有细节，同时提供两个类中方法的细节

标签： angular typescript angular11

【解决方案1】：

尝试将@Directive()/@Component() 添加到基类

用@Directive()（无参数）标记一个抽象类告诉 Angular 它应该编译这个类，创建一个工厂和连接将与之交互的任何方法或属性角度。

   @Directive()
   export abstract class ServiceBase { 
      static onTokenExpired = new EventEmitter(); 
      static onTokenRefreshed = new EventEmitter<string>(); 
      constructor(protected http: HttpClient) { } 
      protected get<T>(url: string, options?: any, ctor?: new () => BaseVO, resolveLater: boolean = false): Observable<T> { .... } 
      protected post<T>(url: string, data: any, options?: any, ctor?: new () => BaseVO, resolveLater: boolean = false):Observable<T> { ----- } 
    }

For More Info

【讨论】：

添加@Directive() 并不能解决问题
你能创建 stackblitz 吗？