SpringBoot+MyBatisPlus+Vue 前后端分离项目快速搭建【前端篇】【快速生成后端代码、封装结果集、增删改查、模糊查找】【毕设基础框架】

前后端分离项目快速搭建【前端篇】

• 后端篇
• 前端篇
• • 创建vue项目
  • 安装所需工具
  • 开始编码
  • • 1、在根目录下添加vue.config.js文件
    • 2、编写main.js
    • 3、编写App.vue
    • 4、编写axiosutils.js
    • 5、在components目录下编写menu.vue
    • 7、在router目录下编写router.js
    • 8、在src目录下创建vuex
    • 9、编写home.vue
    • 10、编写user相关代码（前端核心逻辑代码、增删改查还有模糊查询，包括逻辑删除和物理删除）
    • • 编写index.vue
      • 编写edit.vue
  • 启动前后端测试效果
  • • 启动后端
    • 启动前端
    • 测试
    • • 添加测试
      • 删除测试（物理删除）
      • 禁用测试（逻辑删除）
      • 模糊查找测试

后端篇

SpringBoot+MyBatisPlus+Vue 前后端分离项目快速搭建【后端篇】【快速生成后端代码、封装结果集、增删改查、模糊查找】【毕设基础框架】

前端篇

创建vue项目

1、找个文件夹进入命令行，输入：vue create vue-front

2、直接回车，等待片刻，稍微有点小久

3、根据提示指令测试

打开浏览器输入：http://localhost:8080/

安装所需工具

安装的工具会有点多，为了提供更好的拓展性，可以自主选择安装（不建议），后面的代码中都是使用到了，不安装然后按照我的代码写可能会报错，建议安装，这样拓展性更高。

1、安装vue-router

npm install vue-router

2、安装 element-ui

npm i element-ui -S

3、安装axios

npm install axios