Romanchuk / angular-i18next

angular v10+ integration with i18next v19.4+
MIT License
131 stars 33 forks source link

Is it possible to use this library with Angular Universal and SSR? #104

Closed michal-seidler closed 1 year ago

michal-seidler commented 1 year ago

Can you provide example how to use this library with SSR into documentation?

Romanchuk commented 1 year ago

Yes, it is possible to use angular-i18next with Universal and SSR. There is no specific angular-i18next settings to use it with SSR.

Just use official i18next plugin for SSR:

https://github.com/i18next/i18next-http-middleware

And load you translations from filesystem on node.js backend:

https://www.i18next.com/overview/plugins-and-utils#backends

Demo app implements SSR:

https://github.com/Romanchuk/angular-i18next/tree/master/apps/angular-i18next-demo

I have no time at the moment to make good doc about SSR

michal-seidler commented 1 year ago

Thank you now it's working but I have another issue when I try to prerender I got the: No provider for InjectionToken REQUEST do you have some advice?

Romanchuk commented 1 year ago

@michal-seidler Sorry for waiting:

import { NgModule } from '@angular/core';
import { ServerModule } from '@angular/platform-server';
import { REQUEST } from '@nguniversal/express-engine/tokens';
import { I18NEXT_INSTANCE } from 'angular-i18next';
import type { Request } from 'express';
import { I18NextRequest } from 'i18next-http-middleware';

import { AppComponent } from './app.component';
import { AppModule } from './app.module';

@NgModule({
  imports: [
    AppModule,
    ServerModule,
  ],
  bootstrap: [AppComponent],
  providers: [
    {
      provide: I18NEXT_INSTANCE,
      useFactory: (req: Request & I18NextRequest) => {
          return req.i18n;
      },
      deps: [
        REQUEST
      ]
    }
  ]
})
export class AppServerModule {}
Romanchuk commented 1 year ago

Closed due inactivity