i18next-xhr-backend get data faild React-Native

Question

I have a problem with "i18next-xhr-backend"

I try to get data from a JSON file, which is on a Server.

Firstly my code:

The JSON File:

"de":

[
    {
 "hello": "Hallo Welt!",
  "lang": "Deutsch"
    }
]

"en":

[
    {
 "hello": "Hallo World!",
  "lang": "English"
    }
]

i18next:

import i18next from 'i18next';
import XHR from 'i18next-xhr-backend';
import LocalStorageBackend from 'i18next-localstorage-backend';

i18next
.use(XHR)
.init({
    lng:["de","en"],
    ns: "translation",
    fallbackLng: "de",
    keySeparator: false,
    
    backend:{
        backends:[
            LocalStorageBackend,
            XHR
        ],
         // the same File
        //loadPath: 'http://www.localhost:80/test2/{{lng}}/{{ns}}.json'  
        loadPath: 'http://192.168.178.21:80/test2/{{lng}}/{{ns}}.json'
    }
},(err, t) => {
    if (err) return console.error(err)
    console.log(t("hello"))
})
export default i18next;

App.js:

import React, { Component } from 'react';
import {View, Text } from 'react-native';
import I18n from './i18n';
import { withNamespaces } from 'react-i18next'


export default class App extends Component {

  render(){
    return(
      <View>
        <Text>
        {I18n.t("hello")}
        </Text>
      </View>
    )
  }
}

First I thougth that my JSON File was broken, but when I write a Fetch Funktion it work perfect. Now I had read something about "i18next-async-storage-backend" <-- Here I get a Error "["failed parsing /locales/de/translation.json to json"]" BUT I DONT USE THE LOCAL TRANSLATION!?

I need some tips to fix this problem. I mean it could not be so hevy to get the Translation from a Webserver or a Localserver.

THANKS A LOT

Answer 1

SEARCH IN key: "loadUrl", value: function(t, e) { var n = this;

ADD if (t !== undefined) t = t.replace("../../../app-assets/", "../../../[YOU FOLDER]/app-assets/");