i18next-electron-fs-backend

• This is a fork of i18next-node-fs-backend This is an i18next library designed to work with secure-electron-template. The library is a rough copy of i18next-node-fs-backend but using IPC (inter-process-communication) to request a file be read or written from the electron's main process. The translation files that are written are written synchronously, but this should not be a problem because you should be creating translation files in development only (translation files should already exist before deploying to production environments).

How to install

Install the package

npm i @wallaceosmar/i18next-electron-fs-backend

Add into your i18next config

Based on documentation for a i18next config, import the backend.

1import i18n from "i18next";
2import {
3  initReactI18next
4} from "react-i18next";
5import backend from "@wallaceosmar/i18next-electron-fs-backend";
6
7i18n
8  .use(backend)
9  .use(initReactI18next)
10  .init({
11    backend: {
12      loadPath: "./app/localization/locales/{{lng}}/{{ns}}.json",
13      addPath: "./app/localization/locales/{{lng}}/{{ns}}.missing.json",
14      ipcRenderer: window.api.i18nextElectronBackend // important!
15    },
16
17    // other options you might configure
18    debug: true,
19    saveMissing: true,
20    saveMissingTo: "current",
21    lng: "en"
22  });
23
24export default i18n;

Update your preload.js script

1const {
2    contextBridge,
3    ipcRenderer
4} = require("electron");
5const path = require('path');
6const backend = require("@wallaceosmar/i18next-electron-fs-backend");
7
8contextBridge.exposeInMainWorld(
9    "api", {
10        i18nextElectronBackend: backend.preloadBindings(ipcRenderer, process, path)
11    }
12);

Update your main.js script

In the mainBindings function you have the following parameters:

• ipcMain
• win: the BrowserWindow
• fs: the file system
• path: the path module
• options: the options object(optional)
• absPath: the absolute path to the translation files

1const {
2  app,
3  BrowserWindow,
4  session,
5  ipcMain
6} = require("electron");
7const path = require('path');
8const backend = require("@wallaceosmar/i18next-electron-fs-backend");
9const fs = require("fs");
10
11let win;
12
13async function createWindow() {  
14  win = new BrowserWindow({
15    width: 800,
16    height: 600,
17    webPreferences: {
18      contextIsolation: true,
19      preload: path.join(__dirname, "preload.js")
20    }
21  });
22
23  const options = { absPath: './' };
24  backend.mainBindings(ipcMain, win, fs, path, options); // <- configures the backend
25  
26  // ...
27}
28
29app.on("ready", createWindow);
30
31app.on("window-all-closed", () => {
32  // On macOS it is common for applications and their menu bar
33  // to stay active until the user quits explicitly with Cmd + Q
34  if (process.platform !== "darwin") {
35    app.quit();
36  } else {
37    i18nextBackend.clearMainBindings(ipcMain);
38  }
39});

Options

These are options that are configurable, all values below are defaults.

1{
2    debug: false, // If you'd like to show diagnostic messages
3    loadPath: "/locales/{{lng}}/{{ns}}.json", // Where the translation files get loaded from
4    addPath: "/locales/{{lng}}/{{ns}}.missing.json" // Where the missing translation files get generated    
5}