Giter Site home page Giter Site logo

Won't work with node about loc-i18next HOT 8 CLOSED

mthh avatar mthh commented on June 15, 2024
Won't work with node

from loc-i18next.

Comments (8)

mthh avatar mthh commented on June 15, 2024

Hi,
Thanks for the report!
I guess it fails due to the absence of the document variable (at least that's what I encounter when trying to reproduce your example using jsdom) but do you have any error message to provide ?

from loc-i18next.

mutlucan96 avatar mutlucan96 commented on June 15, 2024

I don't see any error on the console.
(Accidentally closed the issue.)

from loc-i18next.

mthh avatar mthh commented on June 15, 2024

Ok, thanks!

I'm not really used to DOM manipulation from nodejs.
Do you have a global document variable ? Are you using something like jsdom ?

Or maybe can you provide some more code (notably about how you're creating your html element with the hi id) to completely replicate your example so that I can try to identify the problem and think about a solution ?

A solution that I thought for now would be to pass a custom document variable in options to locI18next.init function; if it is not provided it could use window.document by default (which currently works for a web page). But don't hesitate if you have a fix to propose!

from loc-i18next.

mutlucan96 avatar mutlucan96 commented on June 15, 2024

I have a global document variable and don't use something like jsdom. Actually, I've just started a nw.js project. I have nothing but a simple html file and js file. I call the js file from the html's <body>. The only code on the js file is the code in my first post. When I call loc-i18next.min.js from the html file, everything works fine. I just want to call it from the js file. I'm not sure if it makes sense. I'm newbie :)

from loc-i18next.

mthh avatar mthh commented on June 15, 2024

Alright I see!
I will try to reproduce it (I'm playing with nw.js on a toy project so I will try to integrate loc-i18next) and come with a fix (latter this day or tomorrow).

from loc-i18next.

mthh avatar mthh commented on June 15, 2024

I was able to reproduce your problem and to find some kind of workaround.

I'm not sure it's the recommended way to do it, but I propose to pass the document variable as an option to locI18next.init method.

So in your case you could do :

index.js

"use strict";
const i18next = require("i18next");
const locI18next = require("loc-i18next");

const win = nw.Window.get();

i18next.init({
  lng: 'en',
  resources: { 
    en: {
      translation: {
        nav: {
          home: 'Home'
        }
      }
    }
  }
}, function(err, t) {
  if (err) throw err;
  const localize = locI18next.init(i18next, {
    document: win.window.document
    // or `document: document` will also work here..
  });
  localize('.hi');    
});

Other files used for the example:

index.html

<html>
<head><meta charset="utf-8"/><title>Hi!</title></head>
<body>
<p class="hi" data-i18n="nav.home"></p>
<script src="index.js"></script>
</body>
</html>

package.json

{
  "name": "nwjsloci18next-test",
  "main": "index.html",
  "window": {"width": 800, "height": 600},
  "dependencies": {
    "i18next": "^11.6.0",
    "loc-i18next": "mthh/loc-i18next"
  }
}

Can you test that it works as expected for your use-case ?
(by removing loc-18inext from the nodes_modules folder of your project and then using this github version by using "loc-i18next": "mthh/loc-i18next" in your package.json dependencies section)

If so I will release it at 0.1.4.

Thanks!

from loc-i18next.

mutlucan96 avatar mutlucan96 commented on June 15, 2024

document: win.window.document didn't work. But document:document did the trick! It's working as expected.
Thank you so much for your help!

from loc-i18next.

mthh avatar mthh commented on June 15, 2024

Great!
I just released the version 0.1.4 on npm.
Thanks!

from loc-i18next.

Related Issues (10)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.