Angular Workspace Problem after Update from 16 to 19

To sum up, in the company where I worked, we had a rather old Angular project that had not been updated for ages. "Project" might be the wrong term; I will continue to refer to it as a project, but what I actually mean is a workspace containing about six Angular 16 projects and a library.

What I did was create a new branch, update all the versions as described on the Angular website, and add a new project to the workspace—just a default Angular 19 project, without SSR, using SCSS, and that's it.

But when I start the site, I get a white screen and a console error:

main.ts:5 ERROR RuntimeError: NG0203: inject() must be called from an injection context such as a constructor, a factory function, a field initializer, or a function used with `runInInjectionContext`. Find more at https://angular.dev/errors/NG0203
at injectInjectorOnly (core.mjs:1104:11)
at ɵɵinject2 (core.mjs:1114:40)
at Object.factory (core.mjs:19080:42)
at core.mjs:2289:35
at runInInjectorProfilerContext (core.mjs:879:5)
at R3Injector.hydrate (core.mjs:2288:11)
at R3Injector.get (core.mjs:2167:23)
at __spreadProps.getStandaloneInjector (core.mjs:19120:31)
at createRootViewInjector (core.mjs:17315:44)
at ComponentFactory.create (core.mjs:17380:32)


I am quite confused because I haven't even touched the project yet, nor have I added any injections. I already tried common bug-fixing steps found on Google, such as updating Angular packages or deleting the Node cache, but none of these solutions worked. I don’t even get any other error messages besides this one.

I then decided to move away from the workspace setup and generate the project without a workspace—and look at that, it works perfectly! I compared all the files from the working project to the workspace project but couldn't find any major differences in angular.json, package.json, or tsconfig.json.

So my question is: Do you have any idea what I can possibly do to fix this issue?

Continue reading...