vue + element-UI + springboot 前后端分离教程（图文并茂，前端工具vscode，后端工具IntelliJ IDEA）

1、node.js 安装

  （中）https://nodejs.org/zh-cn/ 
  （英）https://nodejs.org/en/

鄙人使用版本为：node-v10.16.1-x64.msi       

网盘链接：https://pan.baidu.com/s/16qAwa9AVKracKID4HvZkDw 
提取码：aj5e 

安装很简单，一路安装即可，安装后查看版本：

    node.js 里面内置了 npm，安装完 node，npm 也就安装好了

2、安装 cnpm（淘宝镜像） 

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

    2、npm config set registry https://registry.npm.taobao.org

3、安装 vue

    cnpm install vue

4、安装 vue-cli 脚手架工具

    cnpm install --global vue-cli

5、创建 vue 项目

    vue init webpack vue-project   注：项目名不能有大写，否则报错

6、vue 集成 element-ui 框架

    1、cnpm i element-ui -S

    2、 在 main.js 中引入

    // 引入 element-ui
    import ElementUI from 'element-ui'
    import 'element-ui/lib/theme-chalk/index.css'
    Vue.use(ElementUI);

7、vue 集成 axios （与后端进行数据交互）

 1、安装 axios
    cnpm install axios --save-dev

    2、 在 main.js 中引入

    // 引入 axios
    import axios from 'axios'
    Vue.prototype.axios = axios 

    至此，前端基本搭建完毕，可以愉快的进行前端玩耍了

    

8、vue 项目 与 springboot 项目进行交互 

    1、springboot 配置文件：

    2、vue 项目配置：

    3、vue 中发送请求（基于 axios，在main.js 中引入，上文有介绍）

         1、post 方式（需要 qs 进行数据转换，在main.js 中引入，看下文）

 

        2、get 方式 （不需要进行数据转换）

 

    4、后台接收方式（传统接收方式）

    至此，基本流程已经打通。。。