Compiler DI errors are difficult to interpret

Angular debugging is bad

Best example:

dependency injection errors

Uncaught Error: Can't resolve all parameters for FormComponent: ([object Object], [object Object], [object Object], [object Object], ?, [object Object], ?, ... and a lot more parameters).
    at syntaxError (compiler.js:2409)
    at CompileMetadataResolver._getDependenciesMetadata (compiler.js:21311)
    at CompileMetadataResolver._getTypeMetadata (compiler.js:21203)
    at CompileMetadataResolver.getNonNormalizedDirectiveMetadata (compiler.js:20822)
    at CompileMetadataResolver._getEntryComponentMetadata (compiler.js:21407)
    at compiler.js:21398
    at Array.forEach (<anonymous>)
    at CompileMetadataResolver._getEntryComponentsFromProvider (compiler.js:21397)
    at compiler.js:21370
    at Array.forEach (<anonymous>)

How i’m suppose to know what exact parameter is cannot be resolved and why?

constructor(
        private snackBar: MatSnackBar,
        @Inject(BackendService) private backend: BackendService,
        @Inject(ChromeMessengerService) private chromeMessenger: ChromeMessengerService,
        @Inject(DateTimeService) private datetime: DateTimeService,
        @Inject(SettingsService) private settings: SettingsService,
        @Inject(StoreService) private store: StoreService,
        ... other dozens of services ...
    ) {

Why it points me to his modules instead of error in my code?

syntaxError | @ | compiler.js:2409
-- | -- | --
  | CompileMetadataResolver._getDependenciesMetadata | @ | compiler.js:21311
  | CompileMetadataResolver._getTypeMetadata | @ | compiler.js:21203
  | CompileMetadataResolver.getNonNormalizedDirectiveMetadata | @ | compiler.js:20822
  | CompileMetadataResolver._getEntryComponentMetadata | @ | compiler.js:21407
  | (anonymous) | @ | compiler.js:21398
  | CompileMetadataResolver._getEntryComponentsFromProvider | @ | compiler.js:21397
  | (anonymous) | @ | compiler.js:21370
  | CompileMetadataResolver._getProvidersMetadata | @ | compiler.js:21333
  | (anonymous) | @ | compiler.js:21335
  | CompileMetadataResolver._getProvidersMetadata | @ | compiler.js:21333
  | (anonymous) | @ | compiler.js:20955
  | CompileMetadataResolver.getNgModuleMetadata | @ | compiler.js:20946
  | CompileMetadataResolver.getNgModuleSummary | @ | compiler.js:20881
  | (anonymous) | @ | compiler.js:20968
  | CompileMetadataResolver.getNgModuleMetadata | @ | compiler.js:20946
  | JitCompiler._loadModules | @ | compiler.js:27106
  | JitCompiler._compileModuleAndComponents | @ | compiler.js:27087
  | JitCompiler.compileModuleAsync | @ | compiler.js:27047
  | CompilerImpl.compileModuleAsync | @ | platform-browser-dynamic.js:143
  | compileNgModuleFactory__PRE_R3__ | @ | core.js:27089
  | PlatformRef.bootstrapModule | @ | core.js:27301
  | ./src/app/grabber/app.main.ts | @ | app.main.ts:15
  | __webpack_require__ | @ | bootstrap:19
  | (anonymous) | @ | bootstrap:83
  | (anonymous) | @ | bootstrap:83

My code is only in app.main.ts:15 and that is only application entry:

platformBrowserDynamic().bootstrapModule(AppModule);

So it clearly tell me: “The problem is somewhere in your app, but I don’t give a **** where it’s exactly”.

[akopchinskiy]

@Airblader

Feel free to send a PR to improve this.

I just did.

If you had ever written a compiler you’d understand why it’s so hard to give good error messages.

If you did write a compiler, you’d know what nonsense you wrote. And what does the compiler have to do with it if it is an interpreter? Or maybe you simply disabled? I get it. Moreover it’s no need to write own compiler to compare Angular’s one with other analogs (Vue, React, Knockout).

But complaining is easier, I get it.

Yeah, so I repeat: tell that nonsense somewhere else.

[Airblader]

I just did.

No you didn’t.

Apart from that I won’t further interact with a troll like you.