react i18next

reagir-i18next

IMPORTANTE:

Master Branch é a versão mais recente usando ganchos (>= v10).

$ > =v10.0.0
npm i react-i18next

react-native: para usar ganchos no react-native, você deve usar react-native v0.59.0 ou superior

Para a versão legada, use o Branch v9.xx

$ v9.0.10 (legacy)
npm i react-i18next@legacy

Documentação

A documentação está publicada em react.i18next.com e as alterações de PR podem ser fornecidas aqui.

A documentação geral do i18next está publicada em www.i18next.com e as alterações de PR podem ser fornecidas aqui.

Como será meu código?

Antes: seu código de reação seria algo como:

...
< div > Just simple content < / div >
< div >
  Hello < strong title = "this is your name" > { name } < / strong>, you have {count} unread message(s). <Link to=" / msgs ">Go to messages</Link>.
</div>
...

Depois: Com o componente trans basta alterá-lo para:

...
< div > { t ( 'simpleContent' ) } < / div >
< Trans i18nKey = "userMessagesUnread" count = { count } >
  Hello < strong title = { t ( 'nameTitle' ) } > { { name } } < / strong>, you have {{count}} unread message. <Link to=" / msgs ">Go to messages</Link>.
</Trans>
...

O que os outros dizem

• Como internacionalizar adequadamente uma aplicação React usando i18next por Adriano Raiano
• I18n com React e i18next via Alligator.io por Danny Hurlburt
• Localização definitiva do aplicativo React (Mobx) com i18next via itnext.io por Viktor Shevchenko
• Internacionalização para reação bem feita Usando o ecossistema i18next i18n via reactjsexample.com
• Como traduzir o aplicativo React com react-i18next via codetain.co por Norbert Suski
• Construindo i18n com Gatsby via gatsbyjs.org por Samuel Goudie
• Obtenha seu aplicativo react.js traduzido com estilo por Jan Mühlemann
• Traduza seu aplicativo móvel expo.io / react-native por Jan Mühlemann
• Você está convidado a compartilhar sua história...

Por que i18next?

• Simplicidade: não há necessidade de alterar a configuração do webpack ou adicionar transpiladores babel adicionais, basta usar create-react-app e pronto.
• Pronto para produção, sabemos que há mais necessidades de produção do que apenas fazer i18n no lado do cliente, por isso oferecemos suporte mais amplo no lado do servidor também (nodejs, php, ruby, .net, ...). Aprenda uma vez - traduza em qualquer lugar .
• Além do i18n, o locize preenche a lacuna entre o desenvolvimento e as traduções - cobrindo todo o processo de tradução.

Fluxo de trabalho de localização

Quer saber mais sobre como seu processo de internacionalização e tradução pode ser simples?

assista ao vídeo

Instalação

A fonte pode ser carregada via npm ou baixada deste repositório.

 # npm package
$ npm install react-i18next

• Se você não usar um carregador de módulo, ele será adicionado a window.reactI18next

Gostou de ler um tutorial passo a passo mais completo?

Aqui você encontrará um tutorial simples sobre como usar melhor o react-i18next. Alguns princípios básicos do i18next e algumas possibilidades interessantes sobre como otimizar seu fluxo de trabalho de localização.

Exemplos

• Exemplo de reação
• Exemplos de reação com texto digitado
• Exemplo locize.com

amostras v9

• Exemplo de reação
• Exemplo de pré-atuação
• Exemplo de reação nativa
• Exemplo expo.io
• Exemplo next.js
• Exemplo de agitação
• Exemplo de navegador hashbase/beaker
• Exemplo de livro de histórias
• Exemplo locize.com
• Exemplo de teste com brincadeira

Requisitos

• reagir >= 16.8.0
• reagir-dom >= 16.8.0
• reagir nativo >= 0,59,0
• i18next >= 10.0.0 (usuários digitados: >=17.0.9)

v9

• react >= 0.14.0 (no caso de <v16 ou preact você precisará definir pai no componente Trans ou globalmente nas opções i18next.react)
• i18próximo >= 2.0.0

Colaboradores principais

Os agradecimentos vão para essas pessoas maravilhosas (chave emoji):

Jan Mühlemann ?

Adriano Raiano ?

Pedro Durek ?

Tigre Abrodi ?

Este projeto segue a especificação de todos os contribuidores. Contribuições de qualquer tipo são bem-vindas!

---

Patrocinadores Ouro

---

localização como serviço - locize.com

Precisando de um gerenciamento de tradução? Quer editar suas traduções com um Editor InContext? Use o original fornecido pelos mantenedores do i18next!

Ao usar o locize você apoia diretamente o futuro do i18next e do react-i18next.

---