React hook to bring locales in your browser
MIT License
React hooks to bring locales in your browser
en
yarn add use-locales react-use
import React from 'react'
import ReactDOM from 'react-dom'
import { LocalesProvider } from 'use-locales'
import App from './app'
ReactDOM.render(
<LocalesProvider hashKey={process.env.REACT_APP_GIT_SHA || Date.now()}>
<App />
</LocalesProvider>
document.getElementById('root'),
)
import React from "react";
import { useLocales } from "use-locales";
const App = () => {
const messages = useLocales();
return <div>{messages.welcome}</div>;
};
<public-path>/locales/<lang>.json
<public-path>
is loaded from PUBLIC_PATH
env variable<lang>
is 2 chars, like en
or fr
Exemple of files: public/locales/en.json
{
"welcome": "Welcome!"
}
public/locales/fr.json
{
"welcome": "Bienvenue !"
}
<LocalesProvider hashKey>
: provider, your nodes must be wrapped by this to use hooks, we recommand to set it at your application root element.
hashKey
: is used to detect if locales have to be fetched before the timeout. A good practice is to use the git commit hash!useLang(): string
: returns the detect language use by the browseruseLocales(path: string?): object
: given the path, returns locales from <public-path>/locales/<lang>.json
path
is not set it will returns all the localesFeel free to discuss or open PR to have a better package all together! Right know I use this package into: