前后端分离项目

springBoot——Vue

需要的环境：

• IDEA代码开发环境，自行根据喜好即可
• 安装node（会集成npm，所以只安装node即可，npm切换为淘宝镜像源）
• jdk1.8+
• vue-cli 4.0+
  以上皆可百度安装，属于基础的，本文不予教学。

首先创建Vue前端模板框架在项目中

新建文件夹spring-vue-first存放前后端项目代码

目录：D:\JAVA\IDEA\IDEAProjects\spring-vue-first

查看vue-cli版本vue -V，没有安装的用下面命令安装：
npm i -g @vue/cli

用cli命令创建vue文件夹存放前端模板，注意下面安装的位置是在你的项目下

选择最后一行Manually select features

选择两个一个是babel，一个是router，上下键是移动光标，空格键选择

然后回车键后选择vue2.0就行

然后提示确定否，直接键入y，然后回车，在选择最后一项In package.json

回车后提示输入确定否，此处可以选择不保存此种创建vue方案，所以直接键入n回车

之后出现上图就代表vue项目正在创建，有点慢，可以自行设置淘宝镜像源加速创建。

如下图，wait a minute即可完成创建：

查看文件夹项目结构：

之后就可以用IDEA直接打开spring-vue-first里的vue这个项目了，注意，是打开vue这个前端项目

由于使用到elementUI所以前往命令行安装element

npm i element-ui -S

然后就可以运行了：

npm run serve

element整合vue具体上手请前往官网–>https://element.eleme.cn/#/zh-CN/component/quickstart
又水了一篇文章/。/。/。\