简述Vue全家桶

Vue全家桶有什么呢？Vue全家桶包括Vue-cli，Vue-router，Vuex，vue-Devtool调试工具、UI组件库。

Vue-cli大家都称为是vue的一个脚手架，能快速搭建出一个单页应用环境出来，里面包含着很多的东西，包括有webpack，npm，nodejs，babel等等。

Vue-router是vue官方的一个路由插件，当我们想做一个单页富应用的项目时，就要用到Vue-router了，Vue-router的作用是当url发生变化的时候，根据url的内容，把对应的组件渲染出来，不用对页面进行刷新就可以达到获取新页面内容的效果。

Vuex是vue的全局状态管理工具，Vuex里面有五个属性，分别是state：用来存放全局响应式数据，mutations：里面存放一些用来修改state数据的方法，actions：存在异步操作的时候调用，也是通过间接调用mutations里的方法来修改state的数据，getters：用来缓存一些将来可能会用到的state里面的状态，类似于computed计算属性，modula：当我们的随着开发的深入，组件越来越多越来越复杂，而Vuex的思想是单一状态树，所以我们可以通过使用modula将这些东西抽离出来作为一个个独立的小模块。

vue-Devtool调试工具是谷歌的一款插件，我们在通过mutations修改state里面的状态的时候，可以通过devtool监测到是哪个组件修改了state里面的值，这也涉及到了为什么我们不要直接通过this.$store.state这样去直接修改state里面的状态，因为这样修改的话devtool是监测不到到底是哪个组件修改的。