search

robisim74 / qwik-speak

Translate your Qwik apps into any language
https://robisim74.gitbook.io/qwik-speak/
MIT License
131 stars 15 forks source link

NX monorepo, only default translations are served on client in js files when run locally #127

Closed mhuretski closed 4 months ago

mhuretski commented 4 months ago

Hi,

I'm having a nx monorepo and have a problem with i18n locally. SSR serves correct values, then they are changed to default values on client. Basically whenever component is hydrated, js files are requested from server and content is always with default values.

I've created empty nx monorepo project with npx create-nx-workspace@latest org-workspace --preset=qwik-nx and added qwik-speak. Here's empty repo that reproduces the issue https://github.com/mhuretski/nx-qwik-issue-repr.

Steps:

  1. pnpm install && npx nx run test:serve
  2. navigate http://localhost:5173/it-IT/
  3. click "LOCALIZED ALERT"

it's value is going to change from "LOCALIZED ALERT" (IT locale value) to "Alert" (default value). This issue is not reproducable with normal project without monorepo.

Issue only affects local development, the values are correct in prod mode. So it's something I can live with but it's quite annoying one to have. I've tried to play around with outDir: '../../dist/apps/test' in qwikSpeakInline options but it didn't help. Could you take a look?

robisim74 commented 4 months ago

@mhuretski Thank you for this detailed issue and for providing the reproduction!

The problem is the basePath: the default value is ./ (https://github.com/robisim74/qwik-speak/blob/main/docs/inline.md#configure), while in your nx repo it is ./apps/test. Therefore you should update the qwikSpeakInlinesettings like this:

    qwikSpeakInline({
      supportedLangs: ['en-US', 'it-IT'],
      defaultLang: 'en-US',
      assetsPath: 'i18n',
      basePath: './apps/test'
    }),

Let me know.

mhuretski commented 4 months ago

Oh, I see, yes, it makes perfect sense, basePath is relative to the root of the project and package has apps/test path.

Thank you very much for the help!