angular7ngx-translateng-build

Angular 7 prod build i18n files not found


I am trying to deploy an Angular 7 app that uses ngx-translate and translated language files in the /dist/assets folder. I specified the correct base href in build. After deployment, I see everything loads, except the languages file which returns an error code 404 (not found).

Ive tried changing the angular.json file a few different ways. I tried changing the TranslateHttpLoader. Nothing seems to be working. I can see the i18n folder with all the language files in the /dist folder. However its not being referenced.

in app.module.ts

export function HttpLoaderFactory(httpClient: HttpClient) {
  return new TranslateHttpLoader(httpClient, './assets/i18n/', '.json');
}

in angular.json

"assets": [
  "src/favicon.ico",
  "src/assets"
],

But i end up getting this error in the browser:

/assets/i18n/en.json 404 not found

Any help would be appreciated!


Solution

  • I faced the same issue like you, I believe that it is related to this command:

    ng build --prod
    

    Try to use this command:

    ng build --base-href=/deployed_app_name/ --prod
    

    For example if your deployed application name is: stackoverflow the command should be like this:

    ng build --base-href=/stackoverflow/ --prod
    

    And here you will have the correct path to your i18n json files