1
0
Fork 0
mirror of https://github.com/terribleplan/next.js.git synced 2024-01-19 02:48:18 +00:00

Split exports in with-react-18next example to avoid ambiguity (#3959)

See context in https://github.com/i18next/react-i18next/issues/397
This commit is contained in:
Alexander Kachkaev 2018-03-07 07:42:14 +00:00 committed by Tim Neutkens
parent 84493a67b3
commit 8bd81f6a68
3 changed files with 19 additions and 13 deletions

View file

@ -1,4 +1,4 @@
const i18n = require('i18next') const i18next = require('i18next')
const XHR = require('i18next-xhr-backend') const XHR = require('i18next-xhr-backend')
const LanguageDetector = require('i18next-browser-languagedetector') const LanguageDetector = require('i18next-browser-languagedetector')
@ -23,20 +23,22 @@ const options = {
} }
} }
const i18nInstance = i18next
// for browser use xhr backend to load translations and browser lng detector // for browser use xhr backend to load translations and browser lng detector
if (process.browser) { if (process.browser) {
i18n i18nInstance
.use(XHR) .use(XHR)
// .use(Cache) // .use(Cache)
.use(LanguageDetector) .use(LanguageDetector)
} }
// initialize if not already initialized // initialize if not already initialized
if (!i18n.isInitialized) i18n.init(options) if (!i18nInstance.isInitialized) i18nInstance.init(options)
// a simple helper to getInitialProps passed on loaded i18n data // a simple helper to getInitialProps passed on loaded i18n data
i18n.getInitialProps = (req, namespaces) => { const getInitialProps = (req, namespaces) => {
if (!namespaces) namespaces = i18n.options.defaultNS if (!namespaces) namespaces = i18nInstance.options.defaultNS
if (typeof namespaces === 'string') namespaces = [namespaces] if (typeof namespaces === 'string') namespaces = [namespaces]
req.i18n.toJSON = () => null // do not serialize i18next instance and send to client req.i18n.toJSON = () => null // do not serialize i18next instance and send to client
@ -56,4 +58,8 @@ i18n.getInitialProps = (req, namespaces) => {
} }
} }
module.exports = i18n module.exports = {
getInitialProps,
i18nInstance,
I18n: i18next.default
}

View file

@ -1,8 +1,8 @@
import { translate } from 'react-i18next' import { translate } from 'react-i18next'
import i18n from '../i18n' import { getInitialProps, I18n } from '../i18n'
export const withI18next = (namespaces = ['common']) => ComposedComponent => { export const withI18next = (namespaces = ['common']) => ComposedComponent => {
const Extended = translate(namespaces, { i18n, wait: process.browser })( const Extended = translate(namespaces, { i18n: I18n, wait: process.browser })(
ComposedComponent ComposedComponent
) )
@ -12,7 +12,7 @@ export const withI18next = (namespaces = ['common']) => ComposedComponent => {
: {} : {}
const i18nInitialProps = const i18nInitialProps =
ctx.req && !process.browser ? i18n.getInitialProps(ctx.req, namespaces) : {} ctx.req && !process.browser ? getInitialProps(ctx.req, namespaces) : {}
return { return {
...composedInitialProps, ...composedInitialProps,

View file

@ -8,11 +8,11 @@ const handle = app.getRequestHandler()
const i18nextMiddleware = require('i18next-express-middleware') const i18nextMiddleware = require('i18next-express-middleware')
const Backend = require('i18next-node-fs-backend') const Backend = require('i18next-node-fs-backend')
const i18n = require('./i18n') const { i18nInstance } = require('./i18n')
// init i18next with serverside settings // init i18next with serverside settings
// using i18next-express-middleware // using i18next-express-middleware
i18n i18nInstance
.use(Backend) .use(Backend)
.use(i18nextMiddleware.LanguageDetector) .use(i18nextMiddleware.LanguageDetector)
.init({ .init({
@ -30,13 +30,13 @@ i18n
const server = express() const server = express()
// enable middleware for i18next // enable middleware for i18next
server.use(i18nextMiddleware.handle(i18n)) server.use(i18nextMiddleware.handle(i18nInstance))
// serve locales for client // serve locales for client
server.use('/locales', express.static(path.join(__dirname, '/locales'))) server.use('/locales', express.static(path.join(__dirname, '/locales')))
// missing keys // missing keys
server.post('/locales/add/:lng/:ns', i18nextMiddleware.missingKeyHandler(i18n)) server.post('/locales/add/:lng/:ns', i18nextMiddleware.missingKeyHandler(i18nInstance))
// use next.js // use next.js
server.get('*', (req, res) => handle(req, res)) server.get('*', (req, res) => handle(req, res))