Failed to load i18N files after ionic build

523 Views Asked by At

After running NG Build to generate a PWA solution, the i18n files of the transloc translation are not being found. I looked for where the files are being pointed, but I didn't find them.

The correct url is http://localhost/mydomain/assets/i18n/en-US.json

enter image description here

transloco-root.module.ts configuration

    import { HttpClient } from '@angular/common/http';
import {
  TRANSLOCO_LOADER,
  Translation,
  TranslocoLoader,
  TRANSLOCO_CONFIG,
  translocoConfig,
  TranslocoModule
} from '@ngneat/transloco';
import { Injectable, NgModule } from '@angular/core';
import { environment } from '../environments/environment';

@Injectable({ providedIn: 'root' })
export class TranslocoHttpLoader implements TranslocoLoader {
  constructor(private http: HttpClient) {}

  getTranslation(lang: string) {
    return this.http.get<Translation>(`./assets/i18n/${lang}.json`);
  }
}

@NgModule({
  exports: [ TranslocoModule ],
  providers: [
    {
      provide: TRANSLOCO_CONFIG,
      useValue: translocoConfig({
        availableLangs: ['en-US', 'pt-BR'],
        defaultLang: 'en-US',
        fallbackLang: 'en-US',
        missingHandler: {
          useFallbackTranslation: true,
          logMissingKey: false
        },
        reRenderOnLangChange: true,
        prodMode: environment.production,
      })
    },
    { provide: TRANSLOCO_LOADER, useClass: TranslocoHttpLoader }
  ]
})
export class TranslocoRootModule {}
1

There are 1 best solutions below

0
On

To solution the issue I set the i18N files to relative path and worked fine.

enter image description here