search

Spittal / vue-i18n-extract

Manage vue-i18n localization with static analysis
https://pixari.github.io/vue-i18n-extract/#what-is-it
MIT License
313 stars 86 forks source link

Unescape single quotes when writing language files #220

Open daniel-jann opened 1 month ago

daniel-jann commented 1 month ago

vue-i18n allows using texts as keys in translation files (eg "This is my text": "This is my text"). It does however mean that we sometimes need escape characters:

$t("A text with \"double quotes\" characters")
<span :title="$t('Here\'s a text that will generate an issue.')">

The vue-i18n-extract will add these strings like so in the translation files (JSON for instance, using noEmptyTranslation and a pipe as separator to avoid nesting keys on dots):

{
  "A text with \"double quotes\" characters": "A text with \"double quotes\" characters",
  "Here\\'s a text that will generate an issue.": "Here\\'s a text that will generate an issue."
}

The first one with double quotes is escaped correctly, but the second one with single quotes is not, and is (rightly so) not picked up by vue-i18n to match the text used in the $t function. Instead it should be extracted to:

{
  "A text with \"double quotes\" characters": "A text with \"double quotes\" characters",
  "Here's a text that will generate an issue.": "Here's a text that will generate an issue."
}
daniel-jann commented 1 month ago

BTW, a workaround would be to use template literals like so:

<span :title="$t(`Here's a text that won't generate an issue.`)">

It'll work until you need to do something like

<span :title="$t(`Template literals use the ${variable} notation to include a variable`)">