Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support TS format for messages #228

Open
3 tasks done
luisdeka opened this issue Feb 24, 2023 · 0 comments
Open
3 tasks done

Support TS format for messages #228

luisdeka opened this issue Feb 24, 2023 · 0 comments

Comments

@luisdeka
Copy link

luisdeka commented Feb 24, 2023

Clear and concise description of the problem

I am using locale files on ".ts" format (can be .js not only .ts) and i would love it to work.

Why? Because i have enums in all my application and have the key centralized por easy change and consistency.

Now is throwing error, of course:

Uncaught (in promise) SyntaxError: Unexpected return type in composer (at message-compiler.esm-bundler.js:54:19)
    at createCompileError (message-compiler.esm-bundler.js:54:19)
    at createI18nError (vue-i18n.runtime.esm-bundler.js:100:12)
    at wrapWithDeps (vue-i18n.runtime.esm-bundler.js:545:19)
    at Object.transrateVNode (vue-i18n.runtime.esm-bundler.js:582:16)
    at Proxy.<anonymous> (vue-i18n.runtime.esm-bundler.js:1326:35)
    at renderComponentRoot (runtime-core.esm-bundler.js:914:44)
    at ReactiveEffect.componentUpdateFn [as fn] (runtime-core.esm-bundler.js:5649:57)
    at ReactiveEffect.run (reactivity.esm-bundler.js:190:25)
    at instance.update (runtime-core.esm-bundler.js:5763:56)
    at setupRenderEffect (runtime-core.esm-bundler.js:5777:9)

Suggested solution

Support .ts/.js files with "export default"
locales/en-US.ts

import { MyEnum } from '@/enums'

export default {
  enums: {
      [MyEnum.first]: 'I am the text of enum first',
      [MyEnum.second]: 'I am the text of enum second',
  },
}

Alternative

The alternative would be to inject at VueI18nPlugin the locale/messages
vite.config.js

VueI18nPlugin({
      include: resolve(__dirname, './src/locales/**'),
      runtimeOnly: true,
    }),

vite.config.js

import enUS from './locales/en-US.ts'
import jaJP from './locales/ja-JP.ts'

..
....
.......
VueI18nPlugin({
      include: { jaJP, enUS },
      runtimeOnly: true,
    }),
......
....
..

Additional context

This allows static keys to be persistent from source, the locale files.

type HaveEnum {
    enum: MyEnum
}
let data: HaveEnum = ....

t(`enum.${data.enum}`)
t(`enum.${MyEnum.first}`)

If you change enum, all continue to work without more changes

Validations

  • Read the Contributing Guidelines.
  • Read the README
  • Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants