error parsing i18n.config.ts with import { type I18nOptions }

[stefanprobst]

Environment

---

• Operating System: Linux
• Node Version: v18.16.0
• Nuxt Version: 3.4.1
• Nitro Version: 2.3.3
• Package Manager: npm@9.5.1
• Builder: vite
• User Config: components, i18n, imports, modules
• Runtime Modules: @nuxtjs/i18n@8.0.0-beta.11
• Build Modules: -

---

Reproduction

https://stackblitz.com/edit/github-smhrtw

Describe the bug

the following i18n.config.ts produces an "unexpected token" error:

import { type I18nOptions } from "@nuxtjs/i18n";

const config: I18nOptions = {
	legacy: false,
	locale: "en",
	messages: {
		en: {
			welcome: "Welcome",
		},
		de: {
			welcome: "Willkommen",
		},
	},
}

export default config

error message:

 ERROR  Cannot start nuxt:  Unexpected token, expected "," (1:15)                                                15:29:24

  at unexpected (node_modules/@mizchi/sucrase/dist/index.cjs:842:17)
  at expect (node_modules/@mizchi/sucrase/dist/index.cjs:830:9)
  at parseImportSpecifiers (node_modules/@mizchi/sucrase/dist/index.cjs:5735:13)
  at parseImport (node_modules/@mizchi/sucrase/dist/index.cjs:5697:9)
  at parseStatementContent (node_modules/@mizchi/sucrase/dist/index.cjs:4981:17)
  at parseStatement (node_modules/@mizchi/sucrase/dist/index.cjs:4906:5)
  at parseBlockBody (node_modules/@mizchi/sucrase/dist/index.cjs:5250:9)
  at parseTopLevel (node_modules/@mizchi/sucrase/dist/index.cjs:4889:5)
  at parseFile (node_modules/@mizchi/sucrase/dist/index.cjs:5760:12)
  at parse (node_modules/@mizchi/sucrase/dist/index.cjs:5771:20)

Additional context

similarly, satisfies I18nOptions also breaks the config parsing (probably because the sucrase fork used in this project has not seen an update in a while)

Logs

No response

[BobbieGoede]

The error thrown is caused by the way you're trying to import the I18nOptions type.

import { type I18nOptions } from "@nuxtjs/i18n";

Should be

import type { I18nOptions } from "@nuxtjs/i18n";

But if you want to use the i18n.options.ts approach for configuration the following should work as expected.

export default defineI18nConfig((nuxt) => ({
  legacy: false,
  locale: 'en',
  messages: {
    en: {
      welcome: 'Welcome',
    },
    de: {
      welcome: 'Willkommen',
    },
  },
}));

[stefanprobst]

import { type XXX } is valid typescript syntax since version 4.5. (and satisfies since v4.9).

(defineI18nConfig unfortunately did not work for me)

[BobbieGoede]

Ah my bad, I had never seen that syntax before 😅, it's odd that it doesn't work. The other approach should work though, I changed your reproduction to use it here https://stackblitz.com/edit/github-smhrtw-lbpqxj?file=i18n.config.ts

I'll look into updating the dependency causing this issue!

Looks like sucrase maintainer is considering implementing/merging the functionality proposed by the fork as seen here alangpierce/sucrase#791.

[kazupon]

I've fixed this issue.
Please check edge channel 8.0.0-beta.11-28059008.d1499b6 version.
Thanks!

[stefanprobst]

still an issue, see https://stackblitz.com/edit/github-smhrtw-nr8flw?file=package.json

[kazupon]

We need to define i18n.config.ts with using defineConfigI18n from v8.0.0-beta.11

https://v8.i18n.nuxtjs.org/getting-started/basic-usage#translate-with-vue-i18n

[stefanprobst]

can you clarify how this has been fixed?

e.g. https://stackblitz.com/edit/github-smhrtw-nr8flw?file=i18n.config.ts still breaks for me

[elizabthpazp]

defineConfigI18n

I still have this problem

[kazupon]

Currently, not support define style the below,

const i18nConfg = (() => ){ ... });
…
export default i18nConfig;

so ,you need to define it directly as export default, that is,

export default defineI18nConfig(() => ({ ... }))

[stefanprobst]

not support define style

should this issue be reopened then?

[kazupon]

I've just opened as new issue at #2094