Next.js: Provide the possibility to include json files inside /public/static/locales/ folder in the vercel lambda

[borispoehland]

Feature request

Is your feature request related to a problem? Please describe.

When deploying a next-i18next translated project to vercel, the serverless lambda doesn't include the .json translation files located under public/static/locales. Thus, following error arises every time when deploying to vercel:

The creator of next-i18next recommended to reach out to the vercel team.
A user then created a issue dedicated to this on the vercel repo . Here, @paulogdm noted that this is due to a known next.js framework limitation, captured in [vercel/next.js#8251].

Unfortunately, there's no real solution or workaround for this problem yet. I opened a new issue for this to give this problem more attention, because no user of next-i18next is able to deploy to vercel because of this framework limitation.

Describe the solution you'd like

• somehow configure that vercel should include all files inside public/static/locales in the serverless lambda

Describe alternatives you've considered

I tried to manually import the language files as suggested here, but the containing folder is still not detected (the error stays the same)

Additional context

Folder structure:

[derek-fong]

Ran into the exact problem today and found this open issue.
Sounds like deploying i18n-enabled solutions to Vercel is not an option until this problem is resolved.

[Timer]

Could you please provide a sample project?

[borispoehland]

Yes, you can clone this boilerplate. It runs the latest version of next-i18next. Deployment to vercel is not possible with it.
Thanks in advance.

[shunkakinoki]

Is there a workaround to this issue as of now?
I'm also stuck with the same issue, and cannot migrate to vercel without solving this because i18n would be disabled, and would result in a 502: BAD_GATEWAY since the lambda function cannot access public/static/locales
Thank you, and I'm searching for a potential workaround

[lavaxun]

I’m currently facing the same issue as well.
Looking forward for a proper solution.

[borispoehland]

Thank you @Timer for taking the time to investigate this

[borispoehland]

@Timer is there any workaround as of now? I'm soon deploying my project and I'd love to deploy it to vercel.

Can the translation files maybe be manually fetched from within an API route or similar?

[Timer]

I've just done a deep inspection of the code and there is nothing that explicitly tells Next.js that you'd be looking for files in that directory. This seems to be an implicit dependency of the library.

This is an intended design detail!

Adding the following lines will fix the files being missing:

diff --git a/i18n.js b/i18n.js
index 30c71f4..dab2492 100644
--- a/i18n.js
+++ b/i18n.js
@@ -1,6 +1,10 @@
 const I18N = require('next-i18next').default;
 const { localeSubpaths } = require('next/config').default().publicRuntimeConfig;

+// Tell Next.js these files will be read at runtime by the below code:
+const path = require('path');
+path.resolve('./public/static/locales/');
+
 const i18nInstance = new I18N({
   defaultLanguage: 'en',
   otherLanguages: ['de'],

path.resolve is the necessary code here!

[borispoehland]

@Timer on the boilerplate I did exactly as you proposed, but I still get the 502 error.

Edit: I think this is rather a problem with next-i18next. I will try to resolve it over there, and will get back here in case it's related to next.js