Vue3和Springboot前后端简单部署

一、Vue3+Springboot 的前后端简单部署 (在win下面部署)

1、前端实现部署

思想: 前端打包项目后、放到nginx中进行部署

1、nginx 安装 和 解压

1、下载 nginx.zip win版本 解压就可以

2、解压后、启动程序

3、访问 nginx 欢迎页面

http://localhost/

80 端口 可以省略 直接访问

4、配置文件说明

1、conf 下面 nginx.conf 文件

shell 复制代码
worker_processes  1;

events {
    worker_connections  1024;
}

http {
    include       mime.types;
    default_type  application/json;

    sendfile        on;
    
    keepalive_timeout  65;

    server {
        listen       80;                # 端口监听 
        server_name  localhost;   
        # 指定前端项目所在的位置 
        location / {                    # 指定项目地址  
            root   html;
            index  index.html index.htm;
        }

        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
    }
}

5、前端 vue3 进行打包操作

或者通过 npm 命令打包 、进入到 项目的当前路劲下面 执行命令:

shell 复制代码
npm run build 

6、把打包后的 dist 放到 、nginx 目录下面

修改 nginx 的配置文件:

复制代码
#user  nobody;
worker_processes  1;

events {
    worker_connections  1024;
}

http {
    include       mime.types;
    default_type  application/octet-stream;

    sendfile        on;

    server {
        listen       9000;        # 端口监听 
        server_name  localhost;
        location / {
            root   dist;           # 指定项目地址 
            index  index.html index.htm;
        }
       
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
    }
}

不要启动多个nginx 不然可以找不到、页面

补充 操作 nginx的一些命令

复制代码
1、查看nginx 是否启动成功的命令:
tasklist /fi "imagename eq nginx.exe"

2、快速停止或关闭nginx:
nginx -s stop

3、完整有序的停止nginx:
nginx -s quit

4、使用taskkill停止或关闭nginx:
taskkill /f /t /im nginx.exe

2、后端实现部署

思想: maven打包项目后、准备好数据库、启动jar 项目包

1、准备好数据库文件、这里是win下面的数据库、路劲可以直接不用修改、如果是其他地方的数据库、需要修改数据库IP

2、打包命令

pom.xml 文件需要有打包插件

xml 复制代码
<!-- Spring Boot的Maven插件,打包插件 -->
<plugin>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-maven-plugin</artifactId>
</plugin>

打包命令

shell 复制代码
mvn clean package

3、启动 打包后的命令

shell 复制代码
java -jar  xxx.jar
相关推荐
MAGICIAN...9 分钟前
【java-软件设计原则】
java·开发语言
砍材农夫14 分钟前
threadlocal
后端
JH307315 分钟前
为什么switch不支持long
java
神奇小汤圆30 分钟前
告别手写HTTP请求!Spring Feign 调用原理深度拆解:从源码到实战,一篇搞懂
后端
盐真卿33 分钟前
python第八部分:高级特性(二)
java·开发语言
布列瑟农的星空35 分钟前
前端都能看懂的Rust入门教程(三)——控制流语句
前端·后端·rust
上海合宙LuatOS38 分钟前
LuatOS核心库API——【audio 】
java·网络·单片机·嵌入式硬件·物联网·音视频·硬件工程
汤姆yu42 分钟前
基于springboot的尿毒症健康管理系统
java·spring boot·后端
TT哇1 小时前
【实习】银行经理端线下领取扫码功能实现方案
java
暮色妖娆丶1 小时前
Spring 源码分析 单例 Bean 的创建过程
spring boot·后端·spring