Vue项目官方依赖库

目录

Vue 2.0的项目扩展
1.如何舒服地使用Atom
  安装插件
  配置皮肤颜色
2.Vue项目引入组件库
  引入方式
  支持ES2015
  Mint UI
  ElementUI
  iView
  Vonic
  MuseUI
3.Vue项目的调试工具
  vue-devtools
  移动端调试
    Chrome DevTools
    Safari Web Inspector
    Eruda
    spy-debuger
4.Vue项目官方依赖库
  vue-loder
  vue-router
  Vuex
5.Vue项目第三方依赖库
  ESlint
    ESlint规则摘要
    ESlint规则风格
    ESlint忽略文件

vue-loder

vue-loader 是Vue官方推出的 Webpack 的加载器，它的作用是将 .vue 组件转换为JavaScript 模块，作为Vue模块开发的重要特性之一，vue-loader的引入是必须的。

在vue-cli提供的webpack、webpack-simple、pwa模板中，默认引入了vue-loader。需要通过创建模板的方式来引入vue-loader，模板的创建方法见之前的Vue2.0安装篇-创建板块

vue-router

vue-router 是官方为Vue深度定制的页面路由，用于单页面应用的开发，也是Vue模块开发的重要特性，但并不是必须引入的。

如果只是开发一些没有关联的单页面，不需要在多个页面中做频繁跳转，甚至都不需要在vue组件之间切换，那么不建议引入vue-router，尤其是在移动端页面体积有限的情况下。

在vue-cli提供的webpack和pwa模板的创建中，加入了引入选项，在这里输入 Y 进行引入：

vue-cli创建项目时选择引入vue-router

或者通过NPM安装

// 在终端安装
npm install vue-router

// 在 main.js 中引入 vue-router
import Vue from 'vue'
import VueRouter from 'vue-router'

Vue.use(VueRouter)

Vuex

Vuex 是官方专为 Vue.js 应用程序的制定状态管理模式，它负责集中管理所有Vue组件的状态，并监听组件状态的变化。

Vuex 能够更好地帮助我们在组件外部管理组件状态，并能配合vue-devtools做一些高级调试（ time-travel、状态快照导入导出）。Vuex的使用，同时也会带来繁琐业务逻辑，所以一般在组件之间中需要做复杂通信的中大型的应用中，才会考虑使用Vuex，简单的状态管理通过中央事件总线（就是this.$emit的方式）就足以胜任。

NPM安装

npm install vuex --save

Yarn安装

yarn add vuex

引入

import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)