vue3+springboot部署到Windows服务器的详细步骤

目录
  • 前言
  • 一、准备工作
  • 二、使用步骤
    • 1.vue部署
    • 2.mysql部署
    • 3.配置Nginx
    • 4.后端部署
  • 总结

前言

提示：这里可以添加本文要记录的大概内容：

参考网上将项目部署到服务器，这里只介绍简单部署的方式。

提示：以下是本篇文章正文内容，下面案例可供参考

一、准备工作

(1) 安装Nginx —— 用于部署vue
(2) 安装mysql —— 数据库
(3)安装jdk
(4) 部署springboot项目

二、使用步骤

1.vue部署

打包vue项目

将dist文件夹拷贝到Nginx的安装目录下

2.mysql部署

mysql网上资料很多，就不多说

3.配置Nginx

配置Nginx
因为现在是把vue前端交给了Nginx代理，所以这里的端口号不一定是我们在vue项目中设置的端口号。这里的端口号必须是当前服务器开放的端口号。

启动Nginx
打开Nginx安装路径下的命令行

代码如下（示例）：

start nginxnginx -s stop

在浏览器中打开网页:http://scck2dev02:8081
自动跳到：http://scck2dev02:8081/#/login

4.后端部署

package打包springboot项目

服务器启动springboot项目

部署成功
在浏览器中打开网页:http://scck2dev02:8081

总结

到此这篇关于vue3+springboot部署到Windows服务器的文章就介绍到这了,更多相关springboot部署Windows服务器内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

赞 (0)

相关推荐

  • docker部署springboot和vue项目的实现步骤

    docker部署springboot和vue项目的实现步骤

    A. docker 部署 springboot项目 一.springboot项目编译打包 二.在项目根目录创建Dockerfile文件 FROM openjdk:8-jdk-alpine VOLUME /tmp ADD ./target/demo-0.0.1-SNAPSHOT.jar demo.jar RUN sh -c 'touch /demo.jar' ENTRYPOINT ["sh", "-c", "java $JAVA_OPTS -Djava.se

  • docker Compose部署springboot+vue前端端分离

    docker Compose部署springboot+vue前端端分离

    目录 (一) 准备工作 一.安装 二.修改生产环境下的配置以及打包操作: (二) 开始部署 一.blog_api 制作镜像 二.dockerCompose编排 三.mysql.redis.nginx的配置: 四.导入数据[数据库表的数据.前端静态web资源] 五.测试并排除错误: 温馨提示:如果有自己的服务器最好不过了,这样部署网项目就可以上线了.没有的话,只能使用localhost 本机访问啦,记得替换 ngixn 中的ip地址.域名为localhost. (一) 准备工作 一.安装 1.安装

  • SpringBoot+Vue 前后端合并部署的配置方法

    SpringBoot+Vue 前后端合并部署的配置方法

    前后端分离开发项目 前端vue项目 服务端springboot项目 如何将vue的静态资源整合到springboot项目里,通过启动jar包的方式部署服务. 前端项目执行npm run build命令进行打包,会自动生成打包后的dist目录文件所有东西放置在Resources/static文件下,如下图 此处index.html文件的资源路径(需要在前端打包配置中进行配置)应该如下图: 对应的springboot:application.yml需添加: server: port: 8080 to

  • 详解SpringBoot注册Windows服务和启动报错的原因

    Windows系统启动Java程序会弹出黑窗口.黑窗口有几点不好.首先它不美观:其次容易误点导致程序关闭:但最让我匪夷所思的是:将鼠标光标选中黑窗口日志信息,程序竟然不会继续执行,日志也不会继续输出.从而导致页面一直处于请求状态.回车后程序才能正常执行.同时客户希望我们能部署在Windows系统上并且做到开机自动启动.针对以上需求将系统程序注册成Windows服务变得尤为重要. 针对于SpringBoot程序,目前主流的方法是采用winsw,简单方便.可是在开发过程中,针对不同的系统,启动服务可

  • vue3+springboot部署到Windows服务器的详细步骤

    目录 前言 一.准备工作 二.使用步骤 1.vue部署 2.mysql部署 3.配置Nginx 4.后端部署 总结 前言 提示:这里可以添加本文要记录的大概内容: 参考网上将项目部署到服务器,这里只介绍简单部署的方式. 提示:以下是本篇文章正文内容,下面案例可供参考 一.准备工作 (1) 安装Nginx —— 用于部署vue(2) 安装mysql —— 数据库(3)安装jdk(4) 部署springboot项目 二.使用步骤 1.vue部署 打包vue项目 将dist文件夹拷贝到Nginx的安装

  • .Net Core WebApi部署到Windows服务器上的步骤

    上一篇学习到了如何简单的创建.Net Core Api和Swagger使用,既然写了接口,那么就需要部署到服务器上才能够正式使用.服务器主要用到了两种系统,Windows和Linux,.Net和Windows都是属于微软爸爸的,那么这一篇就先从部署到Windows服务器系统开始吧. 一.准备服务器 首先,我们需要一台装了Windows Server的云服务器,但是我没有.那么,到这里就结束了.(╮(￣▽￣)╭开玩笑的) 言归正传,我们没有云服务器怎么办,那当然是要买一台了.有人会说有点贵,确实,

  • Vue.js项目部署到服务器的详细步骤

    Vue.js项目部署到服务器的详细步骤

    前言 最近做完了一个项目,Vue.js 2.0 + vuex + axios,还是有点大的.想着做了这么久,放服务器给朋友们体验一下,帮忙找找BUG,于是就有了研究服务器这一篇文章了. 准备工作 服务器 既然是部署到服务器,肯定是需要一个云的.我这里找基友拿的一个,做测试的话,可以买阿里云的学生机,9.9 一个月,不过不是学生的话就比较麻烦,因为涉及敏感操作都需要验证码. 编译打包 将项目打包成 dist 文件,这里我需要跨域请求一些数据,还写了一个小型服务器, app.js 放到 dist 文

  • IDEA 2020 配置Tomcat服务器的详细步骤

    IDEA 2020 配置Tomcat的步骤如下所示: 第一步 下载Tomcat 官网链接:http://tomcat.apache.org/ 选择download,找到自己所要的版本,下载对应版本的Tomcat. 跟我之前的文章一样,我依旧推荐下载免安装的压缩包. 有zip和exe两种格式的,zip(64-bit Windows zip(pgp,md5,sha1))是免安装版的,exe(32-bit/64-bit Windows Service installer(pgp,md5,sha1))是

  • Vue项目打包部署到apache服务器的方法步骤

    Vue项目打包部署到apache服务器的方法步骤

    vue项目在开发环境下,让项目运行起来,是通过npm run dev命令,原理是在本地搭建了一个express服务器. 但是在服务器上就不是这样的,必须要通npm run build命令来对整个项目进行打包,打包后会在项目目录下生成一个dist文件夹,内容如下: 然后就是把这些文件丢到服务器上的某个文件夹下,我这里的文件夹名字是ibms 遇到的问题: 1. 直接去访问http://www.xxx.com/ibms/,会发现网页是白屏的,什么都没有,这就比较奇怪了,其实是因为资源加载的路径有问题!

  • Vue-CLI3.x 自动部署项目至服务器的方法步骤

    目录 前言 一 安装scp2 二.配置测试/生产环境 服务器SSH远程登陆账号信息 三.使用scp2库,创建自动化部署脚本 四.添加 package.json 中的 scripts 命令, 自定义名称为 "deploy", 结束语 前言 平时部署前端项目流程是:先部署到测试环境ok后再发布到生产环境上,部署到测试环境用 xshell 连上服务器,然后用 xftp 连接服务器,然后本地 build 项目,接着把 build 好的文件通过 xftp 上传到服务器上,整个流程感觉稍有繁琐,重

  • vue项目打包后部署到服务器的详细步骤

    vue项目打包后部署到服务器的详细步骤

    耽误了几天, 终于开始写第二篇博客了, 这篇会讲怎么将vue项目打包部署到服务器, 其实和上一篇的uni-app步骤一样的, 就是最后多了一步修改nginx配置, 好 , 上操作 一 ,打包项目 vscode下载链接: 链接: https://pan.baidu.com/s/1PD-Sts-e2V17wSs5FvrLmg 提取码: 2jbf 1 , vscode打开你的vue项目 -- > 点终端- > 新终端- >输入npm run build 按回车 , 显示正在打包..稍等一会 2

  • 最新Windows Server 2012 搭建DNS服务器的详细步骤

    最新Windows Server 2012 搭建DNS服务器的详细步骤

    目录 一.添加DNS服务 二.配置DNS服务 三.测试 为了实现负载均衡,扩展服务器带宽,需要自己配置DNS服务器解析对应域名. 本文记录Windows Server 2012配置DNS服务的方法. 假设域名www.mydomain.com 已在阿里云作了解析,现在需要新增一个二级域名 stream.mydomain.com 做推流服务,需要使用自己配置的DNS服务做请求解析分发. Windows Server 配置 DNS服务器的步骤如下 一.添加DNS服务 打开服务器管理器,选择“添加角色和

  • Vue项目打包并部署nginx服务器的详细步骤

    Vue项目打包并部署nginx服务器的详细步骤

    目录 使用场景: 一.打包 二.部署(nginx) 总结 使用场景: 我们常使用前后端分离项目时,会需要将前端vue打包然后部署. 一.打包 vue项目其实可以直接通过一下语句进行打包: npm run build 默认打包情况如下: 当我们需要将打包名称以及静态资源位置进行修改时便需要进行相应的配置: 1.首先在项目根目录下创建vue.config.js文件 配置内容如下所示(附带跨域问题解决): module.exports = { //打包 publicPath: './', output

  • 将VUE项目部署到服务器的详细步骤

    将VUE项目部署到服务器的详细步骤

    目录 一.idea中vue项目的打包 1.设置打包后项目的名称 2.将项目打包 3.生成的包内的文件如下: 二.部署到服务器 1.找到Nginx的安装位置 2. 将打包后的vue项目文件放在html文件架下面 3.将打包后的文件夹上传至html文件夹 4.配置打开页面的路径 三.用IP地址访问 总结 宝塔面板上操作 一.idea中vue项目的打包 1.设置打包后项目的名称 publicPath:process.env.NODE_ENV === 'production' ? '/back/' :'

随机推荐