Nostalgic Primordial Monster
    Wondering what’s next for npm?Check out our public roadmap! »

    This package has been deprecated

    Author message:

    WARNING: If you would like to use vue-i18n-extensions that is released new features and bug fixes, you need to install @intlify/vue-i18n-extensions.

    vue-i18n-extensions

    0.2.1 • Public • Published

    🌐 vue-i18n-extensions

    CircleCI npm vue-i18n-extensions Dev Token

    Extensions for vue-i18n

    This library exports the following extensions:

    • directive: v-t custom directive for server-side
    • module: v-t custom directive compiler module for vue-template-compiler or vue-loader (compilerModules option)

    💿 Installation

    $ npm i --save-dev vue-i18n-extensions

    🚀 Extensions

    directive: v-t custom directive for server-side

    This directive is v-t custom directive for server-side-rendering. You can specify it as directives option of createRenderer function.

    The following example:

    import Vue from 'vue'
    import VueI18n from 'vue-i18n'
    import { createRenderer } from 'vue-server-renderer'
    import { directive as t } from 'vue-i18n-extensions'
     
    Vue.use(VueI18n)
     
    const i18n = new VueI18n({
      locale: 'en',
      messages: {
        en: {
          hello: 'hello'
        },
        ja: {
          hello: 'こんにちは'
        }
      }
    })
    const renderer = createRenderer({ directives: { t } })
     
    const app = new Vue({
      i18n,
      render (h) {
        // <p v-t="'hello'"></p>
        return h('p', {
          directives: [{
            name: 't', rawName: 'v-t',
            value: ('hello'), expression: "'hello'"
          }]
        })
      }
    })
     
    renderer.renderToString(app, (err, html) => {
      console.log(html) // output -> '<p data-server-rendered="true">hello</p>'
    })

    module: v-t custom directive compiler module

    This module is v-t custom directive module for vue compiler. You can specify it as modules option of vue-template-compiler.

    ⚠️ NOTE: This extension is not isomorphic/universal codes. for Node.js environment only.

    The following example that use compile function of vue-template-compiler:

    import Vue from 'vue'
    import VueI18n from 'vue-i18n'
    import { compile } from 'vue-template-compiler'
    import { module } from 'vue-i18n-extensions'
     
    Vue.use(VueI18n)
     
    const i18n = new VueI18n({
      locale: 'en',
      messages: {
        en: {
          hello: 'hello'
        },
        ja: {
          hello: 'こんにちは'
        }
      },
      missing: (locale, key) => {
        console.log(`translation missing: locale=${locale}, key=${key}`)
      }
    })
    const i18nModule = module(i18n)
     
    const { ast, render } = compile(`<p v-t="'hello'"></p>`, { modules: [i18nModule] })
    console.log(ast.i18n) // output -> 'hello'
    console.log(render) // output -> `with(this){return _c('p',{domProps:{"textContent":_s("hello")}})}`

    The following configration example of vue-loader:

    const Vue = require('vue')
    const VueI18n = require('vue-i18n')
    const i18nExtensions = require('vue-i18n-extensions')
    const messages = require('./locales.json')
     
    Vue.use(VueI18n)
     
    const i18n = new VueI18n({
      locale: 'ja',
      messages: messages
    })
     
    module.exports = {
      module: {
        rules: [{
          test: /\.vue$/,
          loader: 'vue',
          options: {
            compilerModules: [i18nExtensions.module(i18n)],
            // other vue-loader options go here
            loaders: {}
          }
        }]
      }
    }

    📜 Changelog

    Details changes for each release are documented in the CHANGELOG.md.

    ❗️ Issues

    Please make sure to read the Issue Reporting Checklist before opening an issue. Issues not conforming to the guidelines may be closed immediately.

    💪 Contribution

    Please make sure to read the Contributing Guide before making a pull request.

    ©️ License

    MIT

    Install

    npm i vue-i18n-extensions

    DownloadsWeekly Downloads

    7,071

    Version

    0.2.1

    License

    MIT

    Unpacked Size

    12.1 kB

    Total Files

    6

    Last publish

    Collaborators

    • avatar