Adicione o provedor glotstack à sua aplicação React
É tão fácil como adicionar um provider de contexto ao nível mais alto da sua aplicação uma vez. Depois de adicionar o provider, as traduções serão automaticamente carregadas para a sua aplicação conforme o locale fornecido.
<GlotstackProvider initialLocale='en-US' importMethod={importMethod}>
<YourApp/>
</GlotstackProvider>
Obtenha as suas traduções sob demanda — a qualquer momento
yarn glotstack get-translations
Sem mais esperas por especialistas em idiomas. Utilize o nosso CLI para obter as suas traduções sempre que quiser atualizá-las. Usar
context
no ficheiro de traduções garante que correspondem à sua intenção. Utilize
--yaml
se quiser usar ficheiros YAML
sobre YAML.
O Glotstack utiliza uma API simples baseada em hooks
const { t } = useGlotstack()
<>
{t('YourKey', {
assigns: {
Component: <Component prop="f"></Component>,
insertNode: <Icon name="icon-set"/>,
mdash: <>—</>
another: <>{t('OtherKey', {locale: 'en-US'})}
},
})}
</>
Pode usar a opção assigns
para substituir qualquer React.Node
nas traduções. Pode usar a notação <Component>something</Component>
inline, desde que passe o nome do componente adequado em assigns — útil quando não quer criar uma nova chave de tradução. Pode usar {{substitution}}
para substituir diretamente qualquer node.
YourKey:
value: |
This is an example source text. We want to <Component>do this</Component.
We also want to demonstrate {{insertNode}} and {{mdash}}.
We can even nest other translated things {{another}}.