Soluling home   Document home

Vue Localization and Internationalization

Vue Localization and Internationalization

Vue (Wikipedia) is a very popular JavaScript framework to build browser applications. There is no built-in localization support in Vue, but you have to use a 3rd party implementation. The most common add-ons are vue-i18n and vue-i18next. No matter which one of these 3rd party add-ons you use, Soluling localization tool and service support Vue.

The end of the document contains links to get the full source code of the samples. After reading this document, we recommend reading a tutorial about how to use Soluling.




Install vue-i18n.

vue add i18n

Now you have to answer some questions:

vue-i18n makes some changes to you project.

Resource you templates.

<p>Hello World</p>

Add "Hello World" into src\locales\en.json

 "hello": "Hello World"

Change it to

<p>{{ $t('hello') }}</p>

Language select.

Lazy loading.


GitHub and <data-dir>\Samples\Vue contains following Vue samples:

GitHub/Directory Description Notes
vue-i18n Simple multilingual Hello World Vue application using vue-i18n
Try this first!
sport Localized application using vue-i18n and consuming a multilingual Sport API.
Learn more about the application from here.