SpringBoot+Vue项目打包部署

article/2025/10/14 1:47:03

本篇目录:

1. SpringBoot+Vue项目分析;
2. 前后端打包;
3. 部署

1. SpringBoot+Vue项目分析

通常来说,如果采用这样的开发模式,该工程通常是前后端分离的项目;
就是前端美眉开发前端,然后调用张三开发的后端接口进行数据的展示;
但是呢!最后部署的时候,还是要把前端放到后端里面,之后才能进行部署;
并不是分离开发也会分离部署;

2. 前后端打包

2.1 前端打包

通常,我们的前端是在 VsCode 中开发的,如果想要打包,只需要  ctrl+shift+U 调出命令行;
然后输入 npm run build ,之后在项目中会自动生成一个 dist 文件夹,只需要将里面的所有文件直接 copy 到Springboot项目的 static 中就可以了;

dist
在这里插入图片描述

2.2 后端打包

把 dist 中的内容 copy 到 static 里面之后,我们就可以后端项目的打包了;
此时我们只需要调出 Maven 的功能按钮,然后按 clean compile package 就可以了;
之后可以在控制台输出的路径中去找对应的 JAR 文件,然后再进行部署操作;

Maven 功能按钮
在这里插入图片描述

3. 部署

最后一步,也是最简单的一步。我们只需要把打好的 JAR 文件,放到 Linux 服务器上进行部署就可以了;
当我们把 JAR 文件,放到对应的目录之后,只需要在指定的目录中使用 java -jar JAR文件名 就可以完成项目的最终部署了;

http://chatgpt.dhexx.cn/article/1TktCTEE.shtml

相关文章

vue打包部署到tomcat上 页面空白资源加载不出来

1.首先解决静态资源加载不出来的问题; vue3.0解决办法 需要在vue.config.js 添加 publicPath: ‘./’, vue2.0解决办法 找到config目录下的index文件 将assetsPublicPath:‘/’改为assetsPublicPath:‘./’ 做完第一步打包放到tomcat上 静…

vue打包放到java中启动_Springboot+Vue打包部署总结

文章目录 一、Vue打包+部署 1. 打包(npm run build:prod) 2.nginx部署前端vue项目 二、Springboot打包+部署 1.打包(mvn clean package) 2.部署 三、大功告成! 一、Vue打包+部署 1. 打包(npm run build:prod) 打完之后会在src同级目录下生成dist文件下,点开index.html页面在浏…

vue 打包部署在 nginx服务中,以及出现的一些问题

首先来说操作步骤 前提: 1、你已经安装/下载好 nginx 2、你的vue 项目已经打包完成,并得到了 dist 文件夹 部署开始: 1、vue 项目打包,在控制台输入 npm run build 等待打包结束后可在项目的同级目录下得到打包文件夹 dist …

ruoyi前后端分离vue打包部署发布

说明:打包使用的方式是把vue打包成dist文件后,放到若依的“ruoyi_admin”的静态文件模块下面,访问“http://localhost:9070/(端口“9070”是我自定义的)”即可! 步骤: 1、先打包vue后台管理系统…

vue项目打包部署流程

vue项目打包部署流程 一、打包二、部署三、部署多个项目 一、打包 (可选)去除打包后会生成的map文件:在vue.config.js中添加productionSourceMap: false, map文件作用:项目打包后,代码都是经过压缩加密的,…

TongWeb之vue打包部署

VUE静态资源打包部署在tongweb上刷新页面404问题问题现象 F5刷新就会出现404 问题处理方法 方法一&#xff1a;default-web.xml添加error-page标签 <error-page> <error-code>404</error-code> <location>/index.html</location> </error-…

vue打包部署axios跨域问题

工具版本&#xff1a; 【vue -V】:2.9.6 ide工具&#xff1a;VSCode / Idea 前提&#xff1a;我们前端vue工程需要单独部署 一、本地使用命令运行跨域问题。 外网访问的地址&#xff1a;https://www.runoob.com/try/ajax/json_demo.json 本地springboot接口访问的地址&#x…

SpringBoot + Vue打包部署到本地和远程服务器

最近碰到有人问如何将SpringBoot和Vue进行打包部署到Tomcat服务器&#xff0c;由于Vue接触不是很久所以我自己也感兴趣是如何打包部署到本地或者远程服务器上&#xff08;云端&#xff09;。恰好手上也有一个案例需要部署到远程Tomcat空间&#xff0c;琢磨了一点时间总算是搞清…

Vue项目如何打包并部署(nginx)

使用场景: 我们常使用前后端分离项目时,会需要将前端vue打包然后部署。 一.打包 vue项目其实可以直接通过一下语句进行打包&#xff1a; npm run build 默认打包情况如下: 当我们需要将打包名称以及静态资源位置进行修改时便需要进行相应的配置: 1.首先在项目根目录下创建…

Vue项目打包以及部署

一. 打包 npm run build 打包项目后&#xff0c;出现dist文件夹&#xff0c;dist文件夹下的东西就是需要部署的项目。 但是遇到问题&#xff1a;index.html页面出现一片空白&#xff0c;右键检查network发现一堆错误。 解决&#xff1a;没有修改config配置文件&#xff0c;如果…

vue项目打包布署

我们使用Vue做项目时&#xff0c;基本都是前后端分离的&#xff0c;所以项目布署有时是前后单独部署。因此前端开发人员很有必要熟悉一下项目部署的流程。 Vue项目打包部署本身不复杂&#xff0c;不过一些前端同学可能对服务器接触不多&#xff0c;部署过程中还是会遇到这样那…

N皇后问题及答案解

题目 在一张N∗N的国际象棋棋盘上&#xff0c;放置N个皇后&#xff0c;使得所有皇后都无法互相直接攻击得到&#xff0c;&#xff08;皇后可以直接攻击到她所在的横行&#xff0c;竖列&#xff0c;斜方向上的棋子&#xff09;&#xff0c;现在输入一个整数N&#xff0c;表示在N…

N皇后问题递归求解(内附详细代码)

N皇后问题递归求解&#xff08;内附详细代码&#xff09; 内容描述 在n*n的方格棋盘上&#xff0c;放置n个皇后&#xff0c;要求每个皇后不同行、不同列、不同对角线。 解题思路 下面我们以4皇后问题举例&#xff1a; 设queen(i&#xff0c;n)是在1&#xff5e;i-1行上已经放…

八皇后 N皇后

参考打蓝桥杯的通信人 如侵删 所有代码与原博主的代码相似 自作主张的觉着数组设置的太多辽想着改一下代码 写了一个set函数起初简单的认为 把每一个数组元素设置为0 1即可 跑起来后发现有错误 后来修改发现可以设置数组元素 x 只要在同行列或者对角线就会1 符合多个条件就会再…

n皇后学习

洛谷P1219 回溯 #include<cstdio> const int N 13; int n, cnt, ans[N]; void dfs(int row) {if (row n) {if (cnt < 3) {for (int i 0; i < n; i) {if (i > 0)printf(" ");printf("%d", ans[i] 1);}printf("\n");}cnt;ret…

N皇后(回溯算法)

题目 n 皇后问题 研究的是如何将 n 个皇后放置在 nn 的棋盘上&#xff0c;并且使皇后彼此之间不能相互攻击。等价于要求任何两个皇后都不能在同一行、同一列以及同一条斜线上 给你一个整数 n &#xff0c;返回所有不同的 n 皇后问题 的解决方案。 如图&#xff1a;黄色代表放…

求解n皇后

要求&#xff1a;在国际象棋上摆放n个皇后&#xff0c;使其不能互相攻击&#xff0c;即任意两个皇后都不能处于同一行、同一列或同一斜线上&#xff0c;问有多少种摆法 思路&#xff1a;很直观的想法就是在棋盘上一个一个皇后的摆&#xff0c;如果冲突&#xff0c;则摆放在另一…

n皇后 - 位运算版

n皇后问题是大家在递归里会碰到的一个经典问题。以前高中我学DFS的时候&#xff0c;老师首先让我看的就是八皇后。 不过这皇后的时间复杂度大家可想而知了。而接下来的位运算将这个效率重新提到一个高度。 我是以前在Matrix67大牛那里学的&#xff0c;最近数据结构实验刚好碰到…

n皇后最快算法详解

n皇后问题再经典不过了&#xff0c;想必大家也听说过。 再简单说一下吧&#xff0c;就是一个n*n的棋盘&#xff0c;放置n个皇后&#xff0c;使得竖着不攻击&#xff0c;横着不攻击&#xff0c;斜着不攻击。求有多少种方法。 &#xff08;国际象棋不是这么玩的呀 &#xff09; …

51. N 皇后

51. N 皇后 按照国际象棋的规则&#xff0c;皇后可以攻击与之处在同一行或同一列或同一斜线上的棋子。 n 皇后问题 研究的是如何将 n 个皇后放置在 nn 的棋盘上&#xff0c;并且使皇后彼此之间不能相互攻击。 给你一个整数 n &#xff0c;返回所有不同的 n 皇后问题 的解决方…