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

next-translate-plugin with @module-federation/nextjs-mf, useTranslation not working! #63

Open
atwoodcai1991 opened this issue Jul 19, 2023 · 7 comments

Comments

@atwoodcai1991
Copy link

atwoodcai1991 commented Jul 19, 2023

What version of this package are you using?
when i used next-translate-plugin with @module-federation/nextjs-mf, useTranslation not working! help
What operating system, Node.js, and npm version?
node v18.16.1
What happened?
when module.exports = nextTranslate(); works fine!
when

module.exports = nextTranslate(webpack: (config, options) => {
    const location = options.isServer ? 'ssr' : 'chunks'
    config.plugins.push(
      new NextFederationPlugin({
        name: 'main',
        filename: 'static/chunks/main.js',
        exposes: {
        },
        remotes: {
          remoteHeader: `remoteHeader@http://localhost:9000/_next/static/${location}/remoteHeaderEntry.js`,
        },
        shared: {},
        extraOptions: {
          automaticAsyncBoundary: true
        }
      })
    )
    return config
  })

import useTranslation from 'next-translate/useTranslation'
t('mc_common_footer_about')

render: mc_common_footer_about
What did you expect to happen?
translation words~~
Are you willing to submit a pull request to fix this bug?

@atwoodcai1991
Copy link
Author

when i debugger, I found I18nProvider not exec, and lang=''

@aralroca
Copy link
Owner

Thanks to report it. What version of next-translate and next-translate-plugin are you using? BTW; Do you know if this used to work before and has stopped working in the new versions? Thanks

@atwoodcai1991
Copy link
Author

thanks your comment, i found that next-translate-plugin's template code didn't insert bundle. when work with federation

import ${INTERNAL_CONFIG_KEY} from '@next-translate-root/i18n'
import __appWithI18n from 'next-translate/appWithI18n'
${pagePkg.getCode()}
export default __appWithI18n(${pageVariableName}, {
...${INTERNAL_CONFIG_KEY},
isLoader: true,
skipInitialProps: ${skipInitialProps},
${addLoadLocalesFrom(existLocalesFolder)}
});

@atwoodcai1991
Copy link
Author

"next-translate": "^2.5.0",
"next-translate-plugin": "^2.4.4",

@atwoodcai1991
Copy link
Author

here is the data of NEXT_DATA: looks like ok!
{"props":{"pageProps":{"__lang":"uk-UA","__namespaces":{"common":{"mc_common_footer_about_us":"Про нас","mc_common_footer_about":"Про біржу MEXC",............."mc_common_sidebar_customer_hotline_working_hours":"Working Hours: {{workingHours}}"}}},"__N_SSG":true},"page":"/","query":{},"buildId":"development","isFallback":false,"gsp":true,"locale":"uk-UA","locales":["en-US","ru-RU","tr-TR","vi-VN","id-ID","ja-JP","ko-KR","pt-PT","es-ES","it-IT","zh-TW","zh-CN","fa-IR","de-DE","fil-PH","fr-FR","th-TH","ar-AE","uk-UA"],"defaultLocale":"en-US","scriptLoader":[]}

BUT page shows the key words: mc_common_footer_about

@atwoodcai1991 atwoodcai1991 changed the title when i used next-translate-plugin with @module-federation/nextjs-mf, useTranslation not working! help when i used next-translate-plugin with @module-federation/nextjs-mf, useTranslation not working! Jul 26, 2023
@atwoodcai1991 atwoodcai1991 changed the title when i used next-translate-plugin with @module-federation/nextjs-mf, useTranslation not working! next-translate-plugin with @module-federation/nextjs-mf, useTranslation not working! Jul 26, 2023
@atwoodcai1991
Copy link
Author

i debug the code,i get the resolutions:
first, @module-federation/nextjs-mf will insert a template code to _app.page.js

"use client";
(globalThis || self).placeholderModuleEnsure = () => {
throw new Error('should not exec');
  import('react');
  import('react-dom');
......

when next-translate-plugin webpack loader build the code,
loader will find string of use client,then it will not insert templateCode:

import ${INTERNAL_CONFIG_KEY} from '@next-translate-root/i18n'
    import __appWithI18n from 'next-translate/appWithI18n'
    ${pagePkg.getCode()}
    export default __appWithI18n(${pageVariableName}, {
      ...${INTERNAL_CONFIG_KEY},
      isLoader: true,
      skipInitialProps: ${skipInitialProps},
      ${addLoadLocalesFrom(existLocalesFolder)}
    });

@caioebueno
Copy link

Any workaround for this?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants