i18next::backendConnector: loading namespace translation for language es failed

[vabadio]

🐛 Bug Report

I'm getting this error, even though the file exists and is accessible as an absolute url too:

i18next::backendConnector: loading namespace translation for language en failed Error: ENOENT: no such file or directory, open '/locales/en/translation.json'

I'm using astro-i18next with Astro.

My initial config:

export default {
  defaultLocale: "en",
  locales: ["en", "es"],
  i18nextServer: {
    debug: true,
    backend: {
        ns: ['translation'],
        loadPath: '/locales/{{lng}}/{{ns}}.json',
    },
  },
};

Project structure:

• public
• • locales
• • • en
• • • • translation.json
• • • es
• • • • translation.json
• • src
• • • React-based Astro components here
• astro-i18next.config.js
• astro.config.mjs
• package.json
• tsconfig.json

My Environment

• runtime version: node v18.13.0
• i18next version: astroi18 v1.0.0-beta.17
• os: Mac

[adrai]

If that error is coming from server side, the loadPath is for sure wrong. I assume you have no /locales folder in your root directory.
If that error is coming from client side (browser) check the network request.

[vabadio]

@adrai I copied /locales to the root folder and got the same error. http://localhost:3000/locales/en/translation.json is fully accessible though.

And nothing shows up in the network tab, so it's the server side where the issue lies. The loadPath matches the folder structure, even with the path the error lists out ('/locales/en/translation.json').

I'm really lost on this one.

[adrai]

What's the output if you enter this in your shell terminal?
ls -al /locales/en/translation.json

Maybe also try with the relative path (no slash at the start):

loadPath: 'locales/{{lng}}/{{ns}}.json',

[adrai]

@yassinedoghri maybe you can help?

[vabadio]

From the root project folder:

$ ls -al /locales/en/translation.json
ls: /locales/en/translation.json: No such file or directory

Without /

$ ls -al locales/en/translation.json
-rwxrwxrwx  1 victor  staff  30 Jan 30 18:15 locales/en/translation.json

From /public

$ ls -al /locales/en/translation.json
ls: /locales/en/translation.json: No such file or directory
$ ls -al locales/en/translation.json 
-rwxrwxrwx  1 victor  staff  30 Jan 30 18:15 locales/en/translation.json

[adrai]

so just remove the slash

[vabadio]

Got a different error by removing the slash:

i18next::backendConnector: loading namespace translation for language en failed SyntaxError: Unexpected token } in JSON at position 29
    at Object.parse (<anonymous>)
    at parseData (file:///Users/victor/Work/Camino/astro-playground/lead-form/node_modules/i18next-fs-backend/esm/readFile.js:98:24)
    at readFileSync (file:///Users/victor/Work/Camino/astro-playground/lead-form/node_modules/i18next-fs-backend/esm/readFile.js:121:11)
    at Backend.read (file:///Users/victor/Work/Camino/astro-playground/lead-form/node_modules/i18next-fs-backend/esm/index.js:55:31)
    at Connector.read (file:///Users/victor/Work/Camino/astro-playground/lead-form/node_modules/i18next/dist/esm/i18next.js:1790:14)
    at Connector.loadOne (file:///Users/victor/Work/Camino/astro-playground/lead-form/node_modules/i18next/dist/esm/i18next.js:1833:12)
    at file:///Users/victor/Work/Camino/astro-playground/lead-form/node_modules/i18next/dist/esm/i18next.js:1810:16
    at Array.forEach (<anonymous>)
    at Connector.prepareLoading (file:///Users/victor/Work/Camino/astro-playground/lead-form/node_modules/i18next/dist/esm/i18next.js:1809:21)
    at Connector.load (file:///Users/victor/Work/Camino/astro-playground/lead-form/node_modules/i18next/dist/esm/i18next.js:1816:12)

My test translation file:

{
	"leadForm": "Lead form"
}

[adrai]

This is a better error...

Are you sure this is your original content?

{
	"leadForm": "Lead form"
}

A minimal reproducible example would help to investigate.

[vabadio]

I am, yes. I left just one string specifically to help with debugging.

[adrai]

does an error occur with an empty json? {}

[adrai]

if you manually read that file and JSON.parse it, does it work?

[adrai]

btw: based on the astro-i18next code, you might also define the loadPath like this: https://github.com/yassinedoghri/astro-i18next/blob/beta/src/index.ts#L77

[vabadio]

I get the same error with an empty json.

Fetching the file contents returns it correctly:
{ leadForm: 'First name' }

[adrai]

if all this does not help, you might also console.log(data) in this file on line 98: /Users/victor/Work/Camino/astro-playground/lead-form/node_modules/i18next-fs-backend/esm/readFile.js

[vabadio]

console.log results from readFile.js:

{
	"leadForm": "First name",
}

Looks good...

I'll try that different LoadPath definition, but I'll need to get the public path differently because config.publicDir.pathname is not available on astro-i18next.config.js

[adrai]

The ending comma is the problem!!!

[adrai]

should be:

{
	"leadForm": "First name"
}

[vabadio]

The file doesn't have it anymore, I removed it a few mins ago... could it be cached somehow?

[adrai]

I never used astro-i18next before... but I don't think so

[adrai]

fyi: I just tested this example: https://github.com/yassinedoghri/astro-i18next/tree/beta/examples/node
and modified the astro-i18next.config.ts, like this:

import type { AstroI18nextConfig } from "astro-i18next";

const config: AstroI18nextConfig = {
  defaultLocale: "en",
  locales: ["en", "fr"],
  i18nextServer: {
    debug: true,
    backend: {
      ns: ['translation'],
      loadPath: 'public/locales/{{lng}}/{{ns}}.json',
    },
  },
};

export default config;

And it all seems to work as expected.

[vabadio]

I removed the other test project I copied to test with and it worked now! The other one had the comma at the end... idk how or why but I'm thinking it was targeting that one? Idk...

But it works now. Thank you so much for you help, @adrai !

[adrai]

you're welcome... but next time please open the issue in the correct repo... This issue was not really related to react-i18next...

If you like i18next don’t forget to star it. Make a tweet, share the word or have a look at our https://locize.com to support the devs of this project.

There are many ways to help this project 🙏

[yassinedoghri]

@adrai Just saw the mention, sorry for being late to the party... Glad it has been resolved.