Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

with-i18next example #1496

Merged
merged 5 commits into from
Apr 30, 2017
Merged

with-i18next example #1496

merged 5 commits into from
Apr 30, 2017

Conversation

atilafassina
Copy link
Contributor

this example shows (what I believe to be) the simplest configuration to use i18next with NextJS

export async function getTranslation (lang, file, baseUrl) {
const response = await fetch(`${baseUrl}${lang}/${file}.json`)
const json = await response.json()
let translations = {}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

how about:

return {
  [lang]: {
    [file]: json
  }
}

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

much better, updating the code now

@@ -0,0 +1,14 @@
import i18n from 'i18next'

const startI18n = file => {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

const startI18n = file => i18n.init({
  fallbackLng: 'pt',
  resources: file,
  ns: ['common'],
  defaultNS: 'common',
  debug: false
})

const isServer = !!req
const translations = await getTranslation('pt', 'common', 'http://localhost:3000/static/locales/')

return { isServer, translations }
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Are we using the isServer prop?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

not really. My bad.
Lingering code from some previous tests...

export default class Homepage extends Component {
static async getInitialProps ({ req }) {
const isServer = !!req
const translations = await getTranslation('pt', 'common', 'http://localhost:3000/static/locales/')
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Do we need to express the full url? What happens if we deploy to a non localhost env? for example we suggest you can use zeit to deploy

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

for the server-side the polyfill requires it to be an absolute url. I couldn't figure a way of going around that. That's why url is a parameter. I'm fully open to suggestions though...

@timneutkens timneutkens merged commit c9d0670 into vercel:master Apr 30, 2017
@lock lock bot locked as resolved and limited conversation to collaborators May 12, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants