Error when using inside components

[andresilvasantos]

I'm getting this error - Cannot read property 'req' of undefined - when using it like this:

class {
}

<i18n-var/>
<h2>${i18n('home.slogan')}</h2>

If I remove the class definition, it works without errors.
Do you know what the problem might be?

[gunjam]

Hi,

This is designed to be used server side on the assumption you're using i18next middleware in something like express. The 'of undefined' will be the output stream.

I should have probably made that clear in the documentation!

[andresilvasantos]

Yes, I'm using i18next middleware with express.
And I'm rendering pages this way: res.marko(require(...), data);
I noticed you're calling the t() function from out.stream.req, I even refactored the code to work with out.global.i18n, but almost same problem.

I just don't understand why the pages render correctly, successfully translating the page, but printing that error on browser's console.
And when I remove the class {}, everything works as expected. What's the problem I'm not seeing when dealing with components?

And thank you for your quick reply!

[gunjam]

Adding a class {} section declarings the client side widget code, that must be causing the .t() funciton to be called clientside as well as I guess? Maybe there's a way around that. For now I'd just avoid adding a class{} section if you don't need one.

[andresilvasantos]

The problem is that I have lots of routes with client side code that need translations. But no worries, I'll try to see if someone in gitter have a workaround for this. I'll keep you posted!

[gunjam]

Thanks, currently I'm only using the server side rendering aspects of marko in my services, so I haven't encounter this issue.

If you can find a way to fix it, or better yet, add client side translation support into component, that would be great!