Regression: Broken nx serve but working production build

[AlexandreCassagne]

Hi all, I am reviewing the changes between 2.0.6 (last known working for me) and latest v2, and cannot pinpoint my failure.

I am using an nx (monorepo) project structure.

What version of this package are you using?

• 2.6.2 is breaks my configuration
• 2.3.0 is breaks my configuration
• 2.0.6 works

What operating system, Node.js, and npm version?
MacOS/node v20.10.0/npm 10.2.3

What happened?

My configuration breaks and the keys are shown, rather than translated text:

2.0.6: nx serve:

2.3.0: nx serve:

2.0.6: NEXT_TRANSLATE_PATH=../../ nx build + node ./server/main.js in appropriate directory (production build):

2.3.0: NEXT_TRANSLATE_PATH=../../ nx build + node ./server/main.js in appropriate directory (production build):

2.6.2 also breaks nx serve.

In short, only nx serve (i.e. development build) fails, from 2.3.0 onward. I didn't test any versions between 2.0.6 and 2.3.0.

What did you expect to happen?

Configuration is identical in both cases and follows configuration

• apps/appname/src/pages is where my pages are;
• apps/appname/locales;
• apps/appname/i18n.js is simple with no "loadLocalesFrom" set;

Therefore, I would expect the properly configured app in 2.0.6 to still load text properly in 2.3+.

Are you willing to submit a pull request to fix this bug?
Unsure; depends on complexity and whether my use case is still supported ("legacy" pages - not app router).

[AlexandreCassagne]

(one aspect that I haven't mentioned is my NextJS app uses a custom server)

[iuliancmarcu]

Hi @AlexandreCassagne,

I had to fork the library and include the code from the following to make it work perfectly with Nx:

#79
👆🏼 this one fixes the dev mode by loading the files using relative paths

#55
👆🏼 this fixes all the NEXT_TRANSLATE_PATH issues you might face when working with Nx, allowing you to simply pass __dirname as base path
👆🏼 the implementation I chose for this one is the one mentioned in this comment: #55 (comment)

Unfortunately, I cannot expose the package outside of our org for you to use, but forking the repo and publishing a new NPM package to the GH package registry was straightforward.

First, make sure to update the code references of next-translate-plugin/loader into @<yourscope>/next-translate-plugin/loader for everything to work as expected.

Then, here is a publish.yml GH Actions workflow that publishes a new package version whenever you create a release in the forked repository (make sure to update package.json version before):

name: Publish package to GitHub Packages
on:
  release:
    types: [published]
jobs:
  build:
    runs-on: ubuntu-latest
    permissions:
      contents: read
      packages: write
    steps:
      - name: Checkout project
        uses: actions/checkout@v4

      # Pre-install yarn
      - name: Install yarn
        run: |-
          curl -fsSL --create-dirs -o $HOME/bin/yarn \
          https://github.com/yarnpkg/yarn/releases/download/v1.22.19/yarn-1.22.19.js
          chmod +x $HOME/bin/yarn
          echo "$HOME/bin" >> $GITHUB_PATH

      # Setup .npmrc file to publish to GitHub Packages
      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: '20.x'
          registry-url: 'https://npm.pkg.github.com'
      - name: Install dependencies
        run: yarn
      - name: Publish package
        run: yarn publish
        env:
          NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}

I hope this helps!