Admin Ui: Angular error when compiling AdminUiPlugin

Compiling the AdminUiPlugin works with devMode since 1.0.0-beta.3 again, but now the compiled admin-ui throws an error in the Angular code when opening the admin page in browser: TypeError: e.factory is not a function

To Reproduce

1. Start vendure server with AdminUiPlugin.init({ ... app: compileUiExtensions({ ... }) )
2. Open admin page in Browser
3. main.ts:16 TypeError: e.factory is not a function – page doesn’t load

Empty extensions: [] or parameters, including devMode, don’t seem to make a difference.

[michaelbromley]

OK I think I have the reason right here: https://github.com/angular/angular/issues/41193#issuecomment-797554210

Packages must be compiled and ran using the exact same version of Angular; any other combination is not supported and likely to break in subtle ways.

So the @vendure/admin-ui/.. packages have been compiled with the compiler v11.2.4, but now you are trying to use those compiled files with compiler v11.2.5.

The solution is that I need to pin the dependencies of the ui-devkit package to exact patch versions which match those used by the admin-ui package. Currently they are listed as: https://github.com/vendure-ecommerce/vendure/blob/7cc7222f8241ddc5a2401faaed269a4a6f09f564/packages/ui-devkit/package.json#L39-L41

[michaelbromley]

What’s the long term solution for this?

I’ve implemented an automated check to ensure that Angular compiler versions match between the admin-ui & ui-devkit packages. This should prevent such errors being re-introduced in future.