UNPKG

vue-i18n-composable

Version:
132 lines (101 loc) 2.06 kB
# vue-i18n-composable Composition API for `vue-i18n` in Vue 2.x <a href="https://www.npmjs.com/package/vue-i18n-composable"> <img alt="npm" src="https://img.shields.io/npm/v/vue-i18n-composable"> </a> ## Support Vue version - `vue-i18n-composable@v1`: `>=2.5 <=2.6` - `vue-i18n-composable@v2`: `>=2.7 <3` ## Install ```sh npm i vue-i18n vue-i18n-composable ``` if you use Vue 2.5 - Vue 2.6, you need to install `@vue/composition-api` ```sh npm i @vue/composition-api ``` ## Usage ### For Vue 2.7 ```js // main.js import Vue from 'vue' import { createI18n } from 'vue-i18n-composable' import App from './App.vue' const i18n = createI18n({ locale: 'ja', messages: { en: { language: 'English', }, ja: { language: '日本語', }, }, }) const app = new Vue({ render: h => h(App), i18n, }) app.mount('#app') ``` In components: ```vue <template> <div>{{ t('language') }}</div> </template> <script> import { defineComponent } from 'vue' import { useI18n } from 'vue-i18n-composable' export default defineComponent({ setup() { return { ...useI18n() } } }) </script> ``` ### For Vue 2.5 - Vue 2.6 ```js // main.js import Vue from 'vue' import VueCompositionAPI, { createApp } from '@vue/composition-api' import { createI18n } from 'vue-i18n-composable' import App from './App.vue' Vue.use(VueCompositionAPI) const i18n = createI18n({ locale: 'ja', messages: { en: { language: 'English', }, ja: { language: '日本語', }, }, }) const app = createApp({ render: h => h(App), i18n, }) app.mount('#app') ``` In components: ```vue <template> <div>{{ t('language') }}</div> </template> <script> import { defineComponent } from '@vue/composition-api' import { useI18n } from 'vue-i18n-composable' export default defineComponent({ setup() { return { ...useI18n() } } }) </script> ``` ## 📄 License [MIT License](https://github.com/intlify/vue-i18n-composable/blob/master/LICENSE) © 2020 [Anthony Fu](https://github.com/antfu)