Skip to content

Commit

Permalink
docs: Recommend not escaping interpolation values
Browse files Browse the repository at this point in the history
Assuming interpolated values are not expected to be HTML
(and rendered using v-html), they will be treated as plain text
and escaped accordingly.

Also, the fallbackLng: dev default is not usually helpful.
  • Loading branch information
kkuegler committed Aug 9, 2023
1 parent 066dae9 commit b6010b9
Showing 1 changed file with 10 additions and 0 deletions.
10 changes: 10 additions & 0 deletions docs/guide/started.md
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,12 @@ pnpm add i18next-vue

See the [i18next documentation](https://www.i18next.com/overview/api#init) for setting it up. `i18next-vue` does not need a lot of setup on top of that.

::: tip Recommended `i18next` options
We do recommend to set the `interpolation: {escapeValue: false}` option ([i18next docs](https://www.i18next.com/translation-function/interpolation#all-interpolation-options)), because - except in `v-html` - Vue will already properly escape values intended as plain text.

Also, `fallbackLng: false` is a good idea, if you don't explicitly use that.
:::

If you have no i18next setup yet, you can also check out [this tutorial blogpost](https://dev.to/adrai/how-to-properly-internationalize-a-vue-application-using-i18next-1doj) for setting up both i18next and i18next-vue.

```javascript
Expand All @@ -33,6 +39,10 @@ import I18NextVue from 'i18next-vue';

i18next.init({
lng: 'de',
interpolation: {
escapeValue: false
},
fallbackLng: false,
resources: {
...
}
Expand Down

0 comments on commit b6010b9

Please sign in to comment.