i18n: Error while trying to dynamically load/reformat locale messages using definei18nLocale and ts file

Environment

Nuxi 3.4.3

RootDir: /app
Nuxt project info:

Operating System: Linux
Node Version: v18.16.0
Nuxt Version: 3.4.3
Nitro Version: 2.3.3
Package Manager: npm@9.5.1 1:05:29 PM
Builder: vite
User Config: app, components, css, postcss, modules, i18n, runtimeConfig
Runtime Modules: @pinia/nuxt @0.4.9, @nuxtjs/i18n @8.0.0-beta.11, @nuxtjs/google-fonts @3.0.0, @nuxtjs/device @3.1.0, @nuxtjs/tailwindcss @6.6.6
Build Modules: -

Reproduction

reproduction link: https://codesandbox.io/p/sandbox/loving-david-ytv9tc?file=%2Flocales%2Fel-translations.ts

It should translate the message add_option at the index page to ‘Προσθήκη επιλογής’. Instead it doesnt and it logs the error described below.

Describe the bug

I am trying to have all my translations in one translation.json file so I created a .ts file for each of my locales (el.ts and en.ts). In there I am trying to return a correctly formatted/reduced js object for each of the locales but with no luck.

I have wasted hours in trying to figure this out but nothing seems to work.

The way that’s in the reproduction repo is probably the one that throws the fewest errors, but the main one is: ERROR Internal server error: You need to define ‘export default’ that will return the locale messages.

image version in browser:

Can someone please help?

Additional context

I have also tried having the translations file refactored to a json one but with pretty much the same results

Logs

ERROR  Internal server error: You need to define 'export default' that will return the locale messages.
  Plugin: vite:esbuild
  File: /project/sandbox/locales/el-translations.ts
      at generate (/project/sandbox/node_modules/@intlify/bundle-utils/lib/js.js:53:19)
      at TransformContext.esbuildPlugin.transform (file:///project/sandbox/node_modules/@intlify/unplugin-vue-i18n/lib/index.mjs:273:52)
      at processTicksAndRejections (node:internal/process/task_queues:96:5)
      at async Object.transform (file:///project/sandbox/node_modules/vite/dist/node/chunks/dep-e8f070e8.js:42919:30)
      at async loadAndTransform (file:///project/sandbox/node_modules/vite/dist/node/chunks/dep-e8f070e8.js:53385:29)

About this issue

Original URL
State: closed
Created a year ago
Comments: 18

Most upvoted comments

The original error is still a thing for me, 8.0.0-rc.5 any update now?

Thy3634 on Nov 20, 2023

The original error is still a thing for me, even after upgrading to 8.0.0-rc.4.

The error I’m receiving is:

You need to define ‘export default’ that will return the locale messages.

I only have one language file at present, which is en.js and it lives in the directory specified in the langDir config option, which is currently set to lang. The file is a standard JS file (obviously) with one export, which is the default export and contains all of the translations.

I do feel that this issue is in fact not a problem with the @nuxtjs/i18n module, but instead is an issue with the @intlify/unplugin-vue-i18n. I’m just investigating now and will update this issue shortly with my findings.

codetheorist on Sep 21, 2023

Hi! Thank you for your reporting!

This is a bug that causes nuxt i18n to transform files other than el.ts and en.ts into the directory specified in the langDir option.

Until this issue is fixed, a workaround is to put all executable files other than el.ts and en.ts (i.e. el-translations.ts, en-translations.ts and translations.ts) in the directory specified by the langDir option. translations.ts) can be avoided by placing them in some directory, such as the shared` dir, instead of defining them.

kazupon on Jun 12, 2023

@rhengles Which version of @intlify/unplugin-vue-i18n package did you downgrade to? Thanks

netopolit on Mar 3, 2024

FYI: There is already a HMR issue #2026

kazupon on Jun 12, 2023

Thank you!

Leaving just the el.ts and en.ts files in the specified langDIr and moving all the other files to another directory did the trick!

Hoping this gets fixed soon ✌️

Also HMR in these files would be nice, now every time I add a new translation I have to restart nuxt because otherwise I get error: @nuxtjs/i18n Failed locale loading: (431 Request Header Fields Too Large (http://localhost:3000/__nuxt_vite_node__/module/data:text/javascript;charset=utf-8,const%2520resource%2520%253D%2520%257B%250A%2520%2520%2522add%2520option%2522%253A%2520 …)

xjimdim on Jun 12, 2023