前端VUE+后端Springboot 项目搭建

网址:https://v3.cn.vuejs.org/guide/introduction.html#vue-js-是什么
vue.js
node下载:https://nodejs.org/zh-cn/
C:UsersGW00240066Desktopspringboot_vue>npm -v
6.14.14
C:UsersGW00240066Desktopspringboot_vue>node -v
v14.17.4
C:UsersGW00240066Desktopspringboot_vue>npm install -g @vue/cli
...
C:UsersGW00240066Desktopspringboot_vue>vue create vue_springboot_demo

Ctrl + c 关闭当前启动的项目。

App running at:
  - Local:   http://localhost:8080/
  - Network: http://10.20.46.76:8080/

  Note that the development build is not optimized.
  To create a production build, run npm run build.

终止批处理操作吗(Y/N)? y

安装Element-plus

//网址:https://element-plus.gitee.io/#/zh-CN/component/installation
$ npm install element-plus --save

阿里云的springboot搭建网站:

https://start.aliyun.com

上图为搭建项目时所选择的依赖。

下图为项目结构:前端vue,后端springboot 搭建数据库表 启动时出现程序包不存在的错误,要将如图所示选项勾上 Mybatis - plus :官网:https://mp.baomidou.com/

<dependency>
    <groupId>com.baomidou</groupId>
    <artifactId>mybatis-plus-boot-starter</artifactId>
    <version>3.4.3.1</version>
</dependency>

自定义Result 函数返回方法。

package com.example.demo.common;

public class Result<T> {
          
   
    private String code ;
    private String msg ;
    private T data ;
    
    public String getCode() {
          
    return code ; }
    
    public void setCode(String code) {
          
    this.code = code ; }

    public String getMsg() {
          
    return msg; }

    public void setMsg(String msg) {
          
    this.msg = msg; }

    public T getData() {
          
    return data; }

    public void setData(T data) {
          
    this.data = data; }

    public Result(){
          
   
        
    }
    
    public Result(T data) {
          
    this.data = data ; }
    
    public static Result success() {
          
   
        Result result = new Result<>();
        result.setCode("0");
        result.setMsg("成功");
        return result;
    }
    
    public static <T> Result<T> success(T data){
          
   
        Result result = new Result<>();
        result.setCode("0");
        result.setMsg("成功");
        return result;
    }
    
    public static Result error(String code , String msg){
          
   
        Result result = new Result();
        result.setCode(code);
        result.setMsg(msg);
        return result;
    }
}
https://blog..net/xqnode/article/details/118325868
Vue项目搭建常用的配置文件,request.js和vue.config.js

工具类:https://www.hutool.cn/

chrom添加JSON格式:https://www.cnblogs.com/xifenglou/p/11364426.html

选中文件: shift +F6 改名

断点模式,F8跳转

BigDecimal Decimal

@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss", timezone = "GMT+8")
private Date date;

add as maven project

富文本编辑器:https://www.wangeditor.com/

经验分享 程序员 微信小程序 职场和发展