首页 > 其他分享 >在Tomcat下部署若依框架前后端分离SpringBoot+Vue3项目

在Tomcat下部署若依框架前后端分离SpringBoot+Vue3项目

时间:2024-03-18 14:23:42浏览次数:22  
标签:xml SpringBoot Tomcat jar ruoyi 文件夹 Vue3 tomcat war

 

一、后端打包

在ruoyi项目的bin目录下执行package.bat打包Web工程,生成war/jar包文件。
然后会在项目下生成target文件夹包含war或jar

1.jar包

使用命令行执行:java –jar ruoyi-admin.jar 或者执行脚本:ruoyi/bin/run.bat

注意事项【jar包部署,需要使用nginx代理,前端项目中的代理仅能在本地使用】

2.war包

将ruoyi/ruoyi-admin/pom.xml中的packaging修改为war

<packaging>war</packaging>

修改ruoyi-framework/pom.xml,增加去除SpringBoot的内嵌tomcat的设置

<!-- 多模块排除内置tomcat -->
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-web</artifactId>
    <exclusions>
        <exclusion>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-tomcat</artifactId>
        </exclusion>
    </exclusions>
</dependency>

将admin-ruoyi/target下生成的war包放到tomcat/webapp/下即可

二、前端打包

1.打包

# 打包正式环境
npm run build:prod

打包之后会在项目中生成一个dist文件夹

 2.增加web.xml文件

进入到dist目录中,新建文件夹WEB-INF,在此文件夹下创文web.xml文件夹。【如果少设置这一步,F5 刷新页面将显示404。产生原因: 前后端分离开发,前端为SPA应用,路由模式导致】

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
        xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee
        http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
        version="3.1" metadata-complete="true">
     <display-name>/</display-name>
     <error-page>
        <error-code>404</error-code>
        <location>/index.html</location>
    </error-page>
</web-app>

三、部署前后端的包

1.修改Tomcat配置文件server.xml,增加配置

<Context docBase="dist" path="" reloadable="false"/>
<Context docBase="ruoyi-admin" path="/prod-api" reloadable="false"/>

 2.将后端war包、前端dist文件夹上传至tomcat/webapp下

 3.启动tomcat,在tomcat/bin下执行startup.sh即可,启动后能访问到服务即可

标签:xml,SpringBoot,Tomcat,jar,ruoyi,文件夹,Vue3,tomcat,war
From: https://www.cnblogs.com/BKYhailong/p/18079765

相关文章

  • vue3+threejs新手从零开发卡牌游戏(二):初始化场景
    在删掉初始化中一些没用的代码后,在views目录下新建game文件夹,在里面新建一个index.vue,这里就当成游戏的主入口。目录结构如下:下面开始尝试创建场景:一、添加一个div作为threejs的画布对象,之后整个的主要游戏开发内容全在这一个div中(实际threejs会渲染成canvas),并调整样式铺满......
  • 基于SpringBoot的“乐校园二手书交易管理系统”的设计与实现(源码+数据库+文档+PPT)
    基于SpringBoot的“乐校园二手书交易管理系统”的设计与实现(源码+数据库+文档+PPT)开发语言:Java数据库:MySQL技术:SpringBoot工具:IDEA/Ecilpse、Navicat、Maven系统展示系统首页界面图用户注册界面图二手图书界面图留言反馈界面图个人中心界面图管理员......
  • 基于SpringBoot的“书籍学习平台”的设计与实现(源码+数据库+文档+PPT)
    基于SpringBoot的“书籍学习平台”的设计与实现(源码+数据库+文档+PPT)开发语言:Java数据库:MySQL技术:SpringBoot工具:IDEA/Ecilpse、Navicat、Maven系统展示平台首页界面图用户注册界面图付费专区界面图个人中心界面图后台登录界面图管理员功能界面图......
  • 另一种方式启动tomcat catalina.sh run 前台 catalina.sh start 后台
    如果您想使用catalina.sh来启动Tomcat服务器,您可以按照以下步骤进行:打开终端。导航到Tomcat的bin目录,例如:bashcd/path/to/tomcat/bin使用以下命令之一来启动Tomcat服务器:使用catalina.shrun命令来在前台启动Tomcat。这意味着Tomcat将直接在您的终端窗口中运行,......
  • vite打包分包vue3
    //https://vitejs.dev/config///vite.config.jsexportdefaultdefineConfig({plugins:[vue(),vueJsx()],resolve:{alias:{'@':fileURLToPath(newURL('./src',import.meta.url))}},css:{preprocessorOptio......
  • Vue3学习日记 Day4
    注:此课程需要有Git的基础才能学习一、pnpm包管理工具1、使用原因  1.1、速度快,远胜过yarn和npm  1.2、节省磁盘空间 2、使用方式  2.1、安装方式    npminstall-gpnpm  2.2、创建项目    pnpmcreatevue   二、Eslint......
  • Vue3学习日记 Day3 —— Pinia的介绍及使用
    一、Pinia1、介绍 1、介绍 Pinia是Vue最新的状态管理工具,是Vuex的替代品 2、变化 2.1、去掉了modules和mutation,每一个store都是一个独立的模块 2.2、actions即可提供异步,又可提供同步,且可直接修改state数据 2.3、提供更加符合、组合式风格的API ......
  • 基于Java的厦门旅游电子商务预订系统(Vue.js+SpringBoot)
    目录一、摘要1.1项目介绍1.2项目录屏二、功能模块2.1景点类型模块2.2景点档案模块2.3酒店管理模块2.4美食管理模块三、系统设计3.1用例设计3.2数据库设计3.2.1学生表3.2.2学生表3.2.3学生表3.2.4学生表四、系统展示五、核心代码5.1新增景点类型5.2查......
  • Vue3之Composables
    前言Composables 称之为可组合项,熟悉 react 的同学喜欢称之为 hooks ,由于可组合项的存在,Vue3 中的组件之间共享状态比以往任何时候都更容易。这种新范例引入了一种更有组织性和可扩展性的方式来管理整个应用程序的状态和逻辑。什么是Composables本质上,可组合项是一种模式......
  • vue3+ts+vant写移动端项目部Android机页面打开空白
    前言部分安卓机因为内置webview较老,所以无法识别最新的es6的语法,页面打开空白。解决方式,vite项目就使用@vitejs/plugin-legacy,其他项目可以选择使用@babel/core@babel/cli@babel/preset-env这里主要提vite项目,因为babel项目的相关博客较多,就不再复述。 vite.config......