I'm trying to add app-shell to my angular universal application (angular 14).
but getting the following error.
✖ Application shell generation failed.
R3InjectorError(AppServerModule)[ApplicationInitStatus -> InjectionToken Application Initializer -> [object Object] -> AuthenticationService -> Router -> Location -> LocationStrategy -> InjectionToken appBaseHref -> InjectionToken NX_BASE_HREF -> InjectionToken REQUEST -> InjectionToken REQUEST -> InjectionToken REQUEST]:
NullInjectorError: No provider for InjectionToken REQUEST!
Build (ssr build) without app-shell is working fine and REQUEST
token is accessible too, but with app-shell build i'm getting the error.
server.ts
server.get('*', (req, res) => {
res.render(indexHtml, {
req,
providers: [
{ provide: APP_BASE_HREF, useValue: req.baseUrl },
{ provide: REQUEST, useValue: req },
{ provide: RESPONSE, useValue: res },
],
});
});
NX_BASE_HREF
import { REQUEST } from '@nguniversal/express-engine/tokens';
export const NX_BASE_HREF = new InjectionToken<string>('NX_BASE_HREF', {
factory() {
const getBasePath = (basePath: string) => {
const isValidBasePath =
environment.supportedContries
.map((country) => country.toLowerCase())
.indexOf(basePath as SupportedCountry) >= 0;
return `/${isValidBasePath ? basePath : ''}`;
};
const isServer = inject<boolean>(IS_SERVER);
if (isServer) {
const basePath = inject(REQUEST).url.split('/')[1];
return getBasePath(basePath);
} else {
const basePath = window.location.pathname.split('/')[1];
return getBasePath(basePath);
}
},
});
app.server.module.ts
const routes: Routes = [{ path: 'shell', component: AppShellComponent }];
@NgModule({
imports: [AppModule, ServerModule, RouterModule.forRoot(routes)],
bootstrap: [AppComponent],
declarations: [AppShellComponent],
})
export class AppServerModule {}
Important: Build without app-shell is working fine.
I want to build my universal application with app-shell.