next-translate-plugin
next-translate-plugin copied to clipboard
Regression: Broken `nx serve` but working production build
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?
- [x] 2.6.2 is breaks my configuration
- [x] 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/pagesis where my pages are;apps/appname/locales;apps/appname/i18n.jsis 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).
(one aspect that I haven't mentioned is my NextJS app uses a custom server)
Hi @AlexandreCassagne,
I had to fork the library and include the code from the following to make it work perfectly with Nx:
https://github.com/aralroca/next-translate-plugin/pull/79 👆🏼 this one fixes the dev mode by loading the files using relative paths
https://github.com/aralroca/next-translate-plugin/pull/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: https://github.com/aralroca/next-translate-plugin/pull/55#issuecomment-1750252259
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!