npm install vue-i18n

在main.js中引入vue-i18n

import VueI18n from 'vue-i18n'

import LangEn from '../static/en'
import LangZhCHS from '../static/zhCHS'

Vue.use(VueI18n)

const i18n = new VueI18n({
  locale: 'en', // 語言標識
  messages:{
    'en': LangEn,
    'zhCHS': LangZhCHS,
  }
})

掛載到Vue的例項上

new Vue({
  el: '#app'
 
,
  router,
  i18n, //<====
  template: '<App/>',
  components: { App }
})

en.js裡為

module.exports={
  message: {
    hello: 'hello',
    about: 'about',
    welcome: "Welcome"
  }
}

{{ $t("message.welcome") }}

在js中去掉雙引號，，如果外掛裡用值的話應用this指向

屬性中用法

:placeholder="$t('placeholder.enter')"
 

遇到的問題： 
繫結在data中的值，在切換中英文時不會自動更新，正在尋找解決辦法，如有高手知道，可以指點一二。

2018.03.22自答：
去 vue-i18n 提了 issue 才知道是我對 vue 理解不夠深刻，
繫結在data中不會自動更新的原因是 Vue 元件中的 data 屬性只會在元件例項化時候後計算一次
解決辦法是，寫在 computed props 裡

https://github.com/kazupon/vue-i18n/commit/d007ac8e91261dda63eb9ce95cf2b7bb73bf7968

 props: {
    dialogTitle:{
        type: String,
        default: ()=>{this.$t('notice')}
 

    }
  }