springboot/vue 前后端分离项目搭建流程

本次项目搭建用的工具是idea，话不多说，直接上流程。

首先搭建前端vue

1.需要在电脑上安装node.js，安装完成进入小黑窗查看，输入node -v查看版本，出现版本号则安装成功。然后到指定目录下创建vue项目，按下回车键，开始创建项目。以下步骤按照截图所示。

然后需要安装vue-cli，首先安装淘宝镜像，这样安装的速度会快些，输入下面命令。

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

出现该信息则安装成功，然后安装vue-cli,输入cnpm install @vue/cli -g

 

 出现这些信息说明vue-cli脚手架安装成功，随后创建vue项目。

 

这边选择y，以后创建项目的时候就可以直接创建，不用再选择了，然后回车即可。

 至此整个项目创建完成，进入安装目录，输入命令：npm run serve出现相关地址，输入本地地址到网页查看内容，出现vue图标表示安装成功。

 

2.创建后端springboot项目，点击file,new一个project

 图中箭头表示的命名自己看着命名就好了，对应的jdk选择自己需要的。然后点击next。这边可以根据自己需要勾选相应的依赖。

8 

我这边选择了这几项，热部署工具，web依赖，lombok注解以及数据库驱动，后续有需要的依赖可以再添加，点击finish完成创建。 然后创建一个新的文件夹，将前端创建的项目以及后端创建的项目都放到该文件夹下。

然后idea打开创建的文件夹，出现前后端项目，搭建流程到此结束。