Why do I get
Error: StaticInjectorError(AppServerModule)[NgModuleFactoryLoader -> InjectionToken MODULE_MAP]:
StaticInjectorError(Platform: core)[NgModuleFactoryLoader -> InjectionToken MODULE_MAP]:
NullInjectorError: No provider for InjectionToken MODULE_MAP!
when trying to deploy with firebase?
I do use
extraProviders: [
provideModuleMap(LAZY_MODULE_MAP)
]
and in my app-server.module I do import ModuleMapLoaderModule (btw I tried importing ServerModule and AppModule in a different order, I was told it might be the problem, but it didnt work):
@NgModule({
imports: [
ServerModule,
AppModule,
ModuleMapLoaderModule,
],
bootstrap: [AppComponent],
})
export class AppServerModule { }
The main.bundle.js contains this:
Object.defineProperty(exports, "__esModule", { value: true });
var app_server_module_ngfactory_1 = __webpack_require__("./src/app/app.server.module.ngfactory.js");
exports.AppServerModuleNgFactory = app_server_module_ngfactory_1.AppServerModuleNgFactory;
var __lazy_0__ = __webpack_require__("./src/app/features/blog/blog.module.ngfactory.js");
var app_server_module_1 = __webpack_require__("./src/app/app.server.module.ts");
exports.AppServerModule = app_server_module_1.AppServerModule;
exports.LAZY_MODULE_MAP = { "app/features/blog/blog.module#BlogModule": __lazy_0__.BlogModuleNgFactory };
main.bundle.js
does get imported in the firebase script correctly, because if I change some letters in the require(...)
, I get an error that the file is not known. So what is wrong with the LAZY_MODULE_MAP
? it looks like a string-route-to-factory map/js-object and it gets exported. so why does it not get resolved by provideModuleMap
correctly? The BlogModule
has only a declaration of a Hello-World-Stub component.
Btw, there is a similar question here but with no replies: Angular5 Universal lazy loading on firebase hosting and seo
2
Answers
I stumbled on this error when I try to add module-map-ngfactory-loader to enable lazy loading but in the new version of Angular, you don’t need to manually add this module.
String-based lazy loading syntax is not supported with Ivy and hence
@nguniversal/module-map-ngfactory-loader
is no longer required.uninstalling the module (npm uninstall “package-name” ). and removing ModuleMapLoaderModule worked for me.
see here for detail
TLDR;
and remove
ModuleMapLoaderModule
from yourapp.server.module.ts
.TSWM;
In Angular < 9, Universal was relying on
@nguniversal/common
and@nguniversal/module-map-ngfactory-loader
to handle lazy loaded modules. With Angular 9+, they now provide out of the box thengExpressEngine
which handles this. All you need is@nguniversal/express-engine
as the docs mention.