Spring Boot + Vue先后端分离（一）前端Vue环境搭建
先后端分离已经成为互联网项目开发的主流使用方式。前端
经过 nginx + Tomcat 的方式,中间加一个 nodejs有效的进行解耦，而且先后端分离会为之后的大型分布式架构，弹性计算架构，微服务架构，多端化服务（多种客户端，例如：浏览器，车载终端，安卓，IOS等）打下坚实的基础。
vue
这个步骤也是一种进化之路。node
个人开源项目 一点知识学院 技术是spring boot +easyui ，可是不是先后端分离的，ui界面仍是有点旧了，有些朋友说是否能够更换一套ui，还有朋友在学习的时候说能不能作成先后端分离。
webpack
这个固然会知足支持个人朋友，为了能更好的作好先后端分离，我也作了不少准备，从项目的需求，到原型图，再到选择框架技术，最终决定从如今搞起先后端分离的技术，而且不定时的更新有关的技能，最后会开源一个项目，和一点知识学院同样 会是一个完整的项目，拿来即用的那种，但愿对你们有帮助，也多谢你们的支持。
nginx
说到先后端分类，咱们须要了解它的有点，就是咱们为何使用先后端分离？
web
有一下几点，可能会更多，可是目前我看到的几点以下：spring
-
能够实现真正的先后端解耦，前端服务器使用 nginx。vue-cli
-
发现bug，能够快速定位是谁的问题，不会出现互相踢皮球的现象。npm
-
在大并发状况下，能够同时水平扩展先后端服务器后端
-
减小后端服务器的并发/负载压力。
-
即便后端服务器暂时超时或者宕机了，前端页面也会正常访问，只不过数据显示不出来而已。
-
接口能够公用
-
页面显示的东西再多也不怕，由于是异步加载。
-
nginx 支持热部署，不用重启服务器，前端无缝升级。
-
增长代码的维护性&易读性（先后端耦合在一块儿的代码读起来至关费劲）
-
提高开发效率，由于能够先后端并行开发，而不是像之前的强依赖
-
在nginx 中部署证书，外网使用http访问，而且只开发443和80端口，其余端口一概关闭（防止***户端口扫描），内网使用http，性能和安全都有保障
-
前端大量的组件代码得以复用！
目录：
1，安装node.js
2，安装cnpm
3，cnpm安装脚手架vue-cli
4，构建项目
5，安装项目依赖
6，运行项目
下面咱们开启咱们的vue学习之旅吧！！！
1，安装node.js
首先 进入Node.js官网：https://nodejs.org/en/，选择须要的版本下载并安装Node.js。
下载后文件格式以下：
#安装Node
#验证Node.js是否安装好
打开cmd命令行窗口。输入node -v便可获得对应的Node.js版本。
npm包管理器是集成在Node.js中的，因此在安装Node.js的时候就已经自带了npm，输入npm -v可获得npm的版本。
若是须要将 npm版本更新到最新版本，能够输入如下命令npm -g install npm，更新npm至最新版本。
2，安装cnpm
安装 cnpm 执行命令 npm install -g cnpm --registry=https://registry.npm.taobao.org , 国内镜像（npm 国内镜像 https://npm.taobao.org/）cnpm 命令代替默认的npm命令，赖包加载速度快而且没有任何限制。
3，cnpm安装脚手架vue-cli
为何使用脚手架？
vue-cli这个构建工具大大下降了webpack的使用难度，支持热更新，有webpack-dev-server的支持，至关于启动了一个请求服务器，给你搭建了一个测试环境，只关注开发就OK。
在命令行中运行命令 cnpm install -g vue-cli 安装脚手架。
4，构建项目
好了，上面的几个须要的工具和环境已经配置好了，下一步咱们须要构建项目了。
构建项目分以下几步：
1，进入项目须要存储的路径目录下，
2，输入新建项目命令 vue init webpack test-vue，执行后会自动生成vue项目。
效果以下：
进入项目目录。
建立项目
5，安装项目依赖
安装项目依赖用以项目的开发，很简单同样命令搞定。
输入命令 cnpm install 安装项目所需的依赖包资源。
6，运行项目
项目准备完毕后，输入命令npm run dev 来运行项目
项目运行成功后浏览器访问地址 http://localhost:8080 就能够啦。
好的，vue的环境搭建到这里就ok了，后面就能够和springboot后端框架作先后端分离了，期待下篇。。。