Как исправить Uncaught ReferenceError: __ is not defined?

Question

[s_katala]

Пожалуйста, помогите исправить!!!
Пытаюсь подключить перевод i18n-2

import  i18n from 'i18n-2'
export class Navbar extends Component {
  constructor(props) {
    super(props)
  }
  render() {
    return (
        <li><IndexLink to="/" activeClassName={styles.active}>{__('Home')}</IndexLink></li>
  )
}

app.js

i18n.expressBind(app, {
  locales: ['ru', 'en'],
  directory: __dirname + '/locales',
  fallbacks: true,
  extension: '.js',
  defaultLocale: 'ru',
  cookieName: 'lang',
  register: global,
  api: {
    '__': 't',
    '__n': 'tn'
  }
});
app.use(function(req, res, next) {
  if(req.query.lang) {
    req.i18n.setLocaleFromQuery();
    res.cookie('lang', req.i18n.getLocale());
  } else {
    req.i18n.setLocaleFromCookie();
  }
  next();
});

Comments

[yanis_kondakov]

Вы eslint используете?

[Andrey Perov]

s_katala у вас же написано

<li><IndexLink to="/" activeClassName={styles.active}>{__('Home')}</IndexLink></li> // __ is not defined

[s_katala]

Andrey Perov, Я понимаю, а как тогда вывести значение?
в ejs так работает <%- __(`Home`) %>
как определить __?

Answer 1

[levchak0910]

Библиотеку i18n-2 невозможно использовать в реакте, она только для ноди.
Смотрите в код библиотеки.
Вот кусок кода, который отвечает за прочтения файлов с переводами:

var i18n = module.exports = function (opt) {
	...
	if (opt.locales && opt.locales.forEach) {
		this.locales = {};
		opt.locales.forEach(function (locale) {
			self.readFile(locale);
		});
	}
	...
}

i18n.prototype = {
	...
	readFile: function (locale) {
		var file = this.locateFile(locale);
		...
		try {
			var localeFile = fs.readFileSync(file);
			...
	},
	...
}

Comments

[s_katala]

Что самое интересное, перевод сработал, {__('Home')}
и при ?lang=en переводит без проблем, но в браузере ошибка Uncaught ReferenceError: __ is not defined
можете посоветовать нормальную react библиотеку?
чтоб можно было на куку повесить

[levchak0910]

К сожалению, я не знаком с реактом, поэтому ничего лучшего чем ссылку на npm не могу дать.
Посмотрите что там есть и выберите то, что понравится.