{"id":35540,"date":"2021-11-04T12:08:00","date_gmt":"2021-11-04T12:08:00","guid":{"rendered":"https:\/\/phrase.com\/?p=35540"},"modified":"2023-03-30T08:18:24","modified_gmt":"2023-03-30T06:18:24","slug":"vue-2-localization","status":"publish","type":"post","link":"https:\/\/phrase.com\/blog\/posts\/vue-2-localization\/","title":{"rendered":"Vue 2 Localization with Vue I18n: A Step-by-Step Guide"},"content":{"rendered":"

It’s always a pleasure to work with the Vue<\/a> JavaScript framework. The elegance of its design, coupled with the robust first-party additions like Vue Router<\/a> for SPA routing and Vuex<\/a> for state management, make it a delight to use for building modern browser apps.
\nOf course, if you’re here, you probably know this already. You might have an app built with Vue, and you might be wanting to reap the benefits of internationalizing and localizing your app to reach a wider, global market. Well, have no fear.
\nThis tutorial will walk you through everything you need to dive into Vue localization with the extremely popular Vue I18n<\/a> library. Vue I18n plugs into your Vue apps and provides you with translation file management, message formatting, date and number formatting, and more to boot. We’ll fill in the gaps that the library leaves so that you can have a robust i18n cookbook for your Vue apps.<\/p>\n

\u270b\u00a0Heads up \u00bb<\/em> This article covers Vue 2 localization. If you\u2019re interested in Vue 3, check out our guide to Vue localization<\/a>.<\/p>\n

\ud83d\udd17 Resource \u00bb <\/em>We’re using the Vue I18n library in this article. If you would rather use i18next, our tutorial on Vue Translation with vue-i18next<\/a> might be useful to you.<\/p>\n

\ud83d\udd17 Resource <\/i>\u00bb <\/i>Explore the possibilities other frameworks have to offer and learn everything you need to make your JS applications accessible to international users with our ultimate guide to JavaScript localization<\/a>.<\/p>\n

\n
\n

Overview<\/p>\nToggle<\/span><\/path><\/svg><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n