一、Vue基础介绍

简介

1.什么是Vue.js
Vue.js 是目前最火的一个前端框架，React是最流行的一个前端框架（由于开源较早且是谷歌开源，所以最为流行，但是后续已经被Vue.js超越）Vue.js 是前端的主流框架之一，和Angular.js、React.js 一起，并成为前端三大主流框架！
Vue.js 是一套构建用户界面的框架，只关注视图层，它不仅易于上手，还便于与第三方库或既有项目整合。(Vue有配套的第三方类库，可以整合起来做大型项目的开发)
2.前后端分离
前后端分离 的核心思想是前端页面通过 ajax 调用后端的 restuful api 进行数据交互，而 单页面应用（single page web application，SPA），就是只有一张页面，并在用户与应用程序交互时动态更新该页面的 Web 应用程序。Vue就是一种SPA实现方式。
附上 Vue 的官方教程：
https://cn.vuejs.org/v2/guide/

二、Vue使用

环境安装

众所周知， Vue是要使用npm的，而npm 是集成在 Node.js 中的，所以第一步我们需要安装 Node.js，访问官网 https://nodejs.org/en/，首页即可下载。

一路默认安装后，使用命令行窗口查看。

之后可以选择安装 cnpm，即 npm 的国内镜像。使用 cnmp 的好处是在日后下载内容时会比较快，但是下载的包可能不是最新的。
安装 cnpm 的命令为 ：

npm install -g cnpm --registry=https://registry.npm.taobao.org

最后还需要使用 npm install -g vue-cli 安装脚手架。

初始化项目

可以使用多种方式
1.可以在任意的位置中，使用vue init 即可
2.使用编译器（IDEA举例）


3.使用vue ui（需要确保安装vue-cli3以上），直接命令行输入vue ui即可在浏览器出现可视化的web创建过程。

启动

不论是哪种方式创建的vue项目，都需要使用npm install或者是cnpm install构建出 node_modules。在构建成功后，使用nmp run dev或者是cnpm run dev启动项目，启动后访问http://localhost:8080能够看到vue的图标页面就表示启动成功。（vue ui的方式可以在浏览器中直接点击运行进行启动）