kazupon / vue-i18n

:globe_with_meridians: Internationalization plugin for Vue.js

Home Page:https://kazupon.github.io/vue-i18n/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Avaliblity to set `keySeperator`

zoey-kaiser opened this issue · comments

commented

Clear and concise description of the problem

We are using a flat JSON as our style guide. This means we avoid nested objects and separate namespaces by a .:

Our setup

{
	"one.nested": "One nested",
}

Instead of

{
	"one": {
		"nested": "One nested",
	}
}

We wanted to use some linked messages in our translation file, but sadly it looks for the object, instead of the flat translation:

{
	"one.nested": "One nested",
	"two": "Hi @:one.nested" // cannot be found, as it is searching for the object, not the flat entry
}

Suggested solution

While looking into how we can tell i18n, that we do not use objects, I stumbled across their configuration keySeperator (scroll down on this page or search for it: https://www.i18next.com/overview/configuration-options)

As per them they state it:

char to separate keys. If working with a flat JSON, it's recommended to set this to false.

Which seems like it would resolve our issue.

Alternative

As a workaround, we defined the reused translations with an _ instead of a ., however this is not nice, breaks conventions and causes confusion.

Additional context

We use nuxt-i18n, which wraps this library and allows us to pass any configs we want to this library. After searching for a way to set the keySeperator, i was sadly left unsuccessful.

Therefore my question is, how can we set the i18n options, that are set on init, inside vue i18n or where can I disable the key seperator, so it works for our project. If this does not exist, it would be amazing to have!

I had already brough this up in a discussion (#1693), however this did not gain any traction, which is why I wanted to try again with an issue! I hope this is alright.

Thank you so much in advance ❤️

Validations