VUE全家桶是一套基于Vue.js開發(fā)的工具庫，由Vue.js與一系列插件、組件使用組合而成，使Vue.js更加完善。

Vue Router是Vue.js官方的路由管理器，它與 Vue.js 的核心深度集成，讓構(gòu)建單頁面應(yīng)用變得易如反掌。

import Vue from 'vue'
import Router from 'vue-router'
Vue.use(Router)
export default new Router({
routes: [
{
path: '/',
name: 'home',
component: Home
},
{
path: '/about',
name: 'about',
component: About
}
]
})

Vuex是Vue.js的狀態(tài)管理方案，它采用集中式存儲(chǔ)管理應(yīng)用的所有組件的狀態(tài)，并以相應(yīng)的規(guī)則保證狀態(tài)以一種可預(yù)測(cè)的方式發(fā)生變化。

import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
export default new Vuex.Store({
state: {
count: 0
},
mutations: {
increment (state) {
state.count++
}
},
actions: {
incrementAsync ({ commit }) {
setTimeout(() =>{
commit('increment')
}, 1000)
}
},
getters: {
doubleCount (state) {
return state.count * 2
}
}
})

Vue-i18n是一個(gè)國(guó)際化插件，可以在不同語言之間動(dòng)態(tài)切換，使得Web應(yīng)用程序支持多語言。

import Vue from 'vue'
import VueI18n from 'vue-i18n'
Vue.use(VueI18n)
const messages = {
en: {
message: {
hello: 'Hello World!'
}
},
zh: {
message: {
hello: '你好世界！'
}
}
}
export default new VueI18n({
locale: 'en',
messages,
})

Vue-cli是Vue.js的腳手架工具，它提供了一個(gè)交互式的命令行界面，讓開發(fā)者能夠快速搭建Vue.js項(xiàng)目。

$ npm install -g vue-cli
$ vue init webpack my-project
$ cd my-project
$ npm install
$ npm run dev

在VUE全家桶中，Vue.js作為核心，Vue Router、Vuex、Vue-i18n和Vue-cli這些插件、工具幫助我們開發(fā)出更加完善的Vue.js應(yīng)用程序。