如何在linux服务器上用Nginx部署Vue项目,以及如何部署springboot后端项目

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档

文章目录

  • 前言
  • 一、打包Vue项目
  • 二、安装Nginx
    • 1.更新系统的软件包信息:
    • 2.安装Nginx:
    • 3.启动 Nginx 服务:安装完成后,Nginx 服务会自动启动。如果没有自动启动,你可以使用以下命令手动启动 Nginx 服务:
    • 4.验证安装:使用以下命令检查 Nginx 服务是否正在运行:
    • 5.测试是否能够正常访问:
  • 三、配置nginx.conf并部署项目
    • 1.首先需要找到nginx.conf在哪:
    • 2.对nginx.conf文件进行配置:
    • 3.查看编辑后的nginx.conf文件是否有语法错误:
    • 4.重新加载Nginx并重启:
    • 5.通过浏览器访问:
  • 四、后端springBoot项目部署
  • 总结


前言

提示:这里可以添加本文要记录的大概内容:
本文内容记录如何在Linux(Ubuntu)系统上安装Nginx,并部署打包好的Vue前端项目,最后通过浏览器访问。

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

一、打包Vue项目

首先有一个基于Vue开发的前端项目,然后用编辑器打开项目,本文采用Vscode作为前端项目编辑器,打开前端项目后,开一个终端。
在这里插入图片描述

点开Terminal后出现这个界面,后输入一下命令npm run build进行项目打包。在这里插入图片描述

运行成功之后会在项目目录上出现一个dist文件夹,该文件夹就是打包好的项目,把他压缩后上传到服务器,并解压。
在这里插入图片描述

二、安装Nginx

连接到Linux服务器,我这是在虚拟机上安装的Linux(Ubuntu)操作系统,有可视化界面,然后右键打开一个终端,如果是云服务器,或者其他,应该连接后就是一个终端窗口。然后在终端窗口通过命令安装Nginx。

1.更新系统的软件包信息:

sudo apt update

2.安装Nginx:

sudo apt install nginx

3.启动 Nginx 服务:安装完成后,Nginx 服务会自动启动。如果没有自动启动,你可以使用以下命令手动启动 Nginx 服务:

sudo systemctl start nginx

4.验证安装:使用以下命令检查 Nginx 服务是否正在运行:

sudo systemctl status nginx

r在这里插入图片描述
运行结果如果出现上图所示表示,Nginx运行成功。

5.测试是否能够正常访问:

首先查看本机电脑是否能够正常连接你安装了Nginx的那台服务器。可以通过ping +服务器地址进行查看。首先通过Win+R并在输入框输入cmd打开本机终端。
在这里插入图片描述
如果数据包没有丢失,说明是通的。然后在浏览器中输入 你ping的服务器地址加80端口,例如192.132.128.138:80,如果出现一下界面说明可以正常访问Nginx。
在这里插入图片描述

三、配置nginx.conf并部署项目

接下来要把之前上传到服务器的前端项目和Nginx进行绑定。这就需要通过配置nginx.conf文件进行绑定,当然这里还可以配置一下其他的内容,例如反向代理,安全之类。

1.首先需要找到nginx.conf在哪:

一般下载后的Nginx会在 /etc/nginx文件夹下。如何找不到可以通过命令进行搜索。

sudo find / -name nginx.conf

找到nginx.conf后进入其所在的文件夹。然后通过下面命令进行编辑,

sudo vim nginx.conf

2.对nginx.conf文件进行配置:

打开nginx.conf后找以下位置进行配置。该文件中有个http{}模块如下所示,并在该模块内部的任意空白位置添加以下内容:

http{ 
 ##
        # Basic Settings
        ##
        sendfile on;
        #
         server {
                listen 80; #默认端口号,如过有被其他进程占用可以换一个。
                server_name 192.132.128.138;  #换成你的服务器地址
              
                location / {
                       root  /home/user/dist; #上传到服务器的前端项目所在根目录(就是打包生成的dist文件夹)。
                       index index.html index.htm ;

                      }

               }

}

ps(按 i 进行文本编辑,编辑好后按Esc切换模式,之后并按:wq进行保存并退出。)

3.查看编辑后的nginx.conf文件是否有语法错误:

sudo nginx -t

在这里插入图片描述
如何显示ok 和successful说明没有语法错误。

4.重新加载Nginx并重启:

sudo systemctl reload nginx
sudo systemctl restart nginx

5.通过浏览器访问:

浏览器中输入192.132.128.138:80就可出现项目的首页。

四、后端springBoot项目部署

这个部署起来是很容易的直接把项目打成jar包,上传到服务器,然后通过一个命令就能启动。
在这里插入图片描述
直接在idea中的maven中找到Lifecyle,然后双击package。就会在target目录中生成项目jar包。
或者通过命令窗口用mvn package 命令进行打包,前提要安装maven,不然会显示无法识别mvn,并且运行该命令时的位置在springboot项目的根目录下。
将打包好的jar包上传到服务器的某个位置最好新建一个文件夹(例如target)。通过以下命令启动后端项目。

java -jar target/your-project-name.jar --spring.profiles.active=dev

ps: --spring.profiles.active=dev 为指定采用哪个applicatiion.yml文件。

总结

这样前后端项目就都部署运行了。不给过最初还得安装好数据库等一些项目中应用到的软件,才能使得项目正常运行。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/574173.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

C语言进阶:指针的进阶(上)

首先 在学习新知识之前 我们先来回顾下之前的学习的内容 1 指针是个变量 用来存放地址 地址唯一标识的一块内存空间 2 指针的大小是固定的4/8字节(32位平台/64位平台) 3 指针有类型的 指针的类型决定了两点 一个是指针操作的权限以及整数的步长 4 指针的…

「deepin生态共建小组」正式启动招募!三大生态共建项目,速来 !

基于社区开源精神,为提高大家对deepin生态建设的参与感,应用商店将正式开放众多软件给广大开源爱好者进行维护。参与小组工作可获得多项专属小组福利,工作项目分为玲珑格式迁移、wine应用打包、deb原生应用维护。 招募条件 1)不限…

vivado Versal 串行 I/O 硬件调试流程、使用 Vivado Serial I/O Analyzer 来调试设计

Versal 串行 I/O 硬件调试流程 Versal ™ ACAP 无需再生成 IBERT IP , 因为使用系统内串行 I/O 调试所需的必要逻辑现已集成到 GTY 收发器架构内。使 用 GTY 收发器的任何设计均可用于串行 I/O 硬件调试。 Versal 串行 I/O 硬件调试流程具有 2 个不同阶…

蓝桥杯python考级整理

4_1:算术运算符 4_2:基本语法 4_3:基本语法 4_4:列表 4_5:函数 4_6:字符串 4_7:列表 4_8:逻辑运算符 4_9:字典 4_10:函数

CSS中的 5 类常见伪元素详解!

你好,我是云桃桃。 一个希望帮助更多朋友快速入门 WEB 前端的程序媛。 云桃桃-大专生,一枚程序媛,感谢关注。回复 “前端基础题”,可免费获得前端基础 100 题汇总,回复 “前端工具”,可获取 Web 开发工具合…

InternLM2-lesson5

目录 大模型部署挑战常用大模型部署方式模型剪枝(Pruning)知识蒸馏量化 LMDeploy核心功能性能表现支持部署的模型 作业配置 LMDeploy 运行环境以命令行方式与 InternLM2-Chat-1.8B 模型对话 大模型部署 大模型部署就是将大模型在特定的环境种运行!可以部署到服务器…

day13 ts后端持久层框架(java转ts全栈/3R教室)

简介:如果说TS全栈后端开发最重要的两个框架,除了nestjs就是持久层框架了,这里主要看下Typeorm(java中常用的就是mybatis,springdatajpa,hebernite了) 先回顾下ORM的概念:ORM就是建…

好用的在线客服系统PHP源码(开源代码+终身使用+安装教程) 制作第一步

创建一个在线客服系统是一个涉及多个步骤的过程,包括前端界面设计、后端逻辑处理、数据库设计、用户认证、实时通信等多个方面。以下是使用PHP制作在线客服系统的第一步:需求分析和系统设计。演示:ym.fzapp.top 第一步:需求分析 确…

Linux:进程创建 进程终止

Linux&#xff1a;进程创建 & 进程终止 进程创建fork写时拷贝 进程终止退出码strerrorerrno 异常信号exit 进程创建 fork fork函数可以用于在程序内部创建子进程&#xff0c;其包含在头文件<unistd.h>中&#xff0c;直接调用fork()就可以创建子进程了。 示例代码&…

暴雨亮相CCBN2024 助力广电行业数智化转型

4月23日&#xff0c;第三十届中国国际广播电视信息网络展览会&#xff08;简称CCBN2024&#xff09;在北京开展&#xff0c;本次展览会由国家广播电视总局指导、广播电视科学研究院主办&#xff0c;作为国内广电视听领域首个综合性、专业化、引领性、国际化科技产业盛会&#x…

【树莓派】如何用电脑连接树莓派的远程桌面,灰屏解决

要使用VNC桌面连接到树莓派&#xff0c;你需要确保已经安装并启动了VNC服务器。以下是连接到树莓派的步骤&#xff1a; 在树莓派上启动VNC服务器&#xff1a; 打开终端或SSH连接到你的树莓派。输入以下命令以安装RealVNC的VNC服务器&#xff1a;sudo apt update sudo apt insta…

第十讲:C语言指针(4)

目录 1、回调函数是什么&#xff1f; 2、qsort使⽤举例 2.1、使⽤qsort函数排序整型数据 2.2、使⽤qsort排序结构数据 3、qsort函数的模拟实现 4、sizeof和strlen的对⽐ 4.1、sizeof 4.2、strlen 4.3、sizeof 和 strlen的对⽐ 5、数组和指针笔试题解析 5.1、⼀维数组…

java-反射

简介 获取class对象的API // 1. 通过类名.class Class<Student> clazz Student.class; System.out.println(clazz.getName());// 2. 通过Class.forName()方法 Class<?> clazz2 null; try {clazz2 Class.forName("com.reflect.Student");System.out.p…

B2B企业如何做好谷歌Google广告推广营销布局?

当今全球化的商业环境中&#xff0c;B2B企业要想在激烈的市场竞争中脱颖而出&#xff0c;拓展海外市场成为了必经之路。而谷歌Google广告&#xff0c;作为全球最大的在线广告平台&#xff0c;无疑是企业触达全球潜在客户的黄金钥匙。云衔科技通过专业服务助力企业轻松开户与高效…

【ai相关】人工智能的概念

一、人工智能的定义 人工智能&#xff0c;简称AI&#xff0c;是指由机器或计算机系统所展现出的类似于人类智能的行为和能力。其核心在于使机器能够像人类一样进行思考和行动&#xff0c;而这些思考和行动都是基于理性的决策和判断。 什么是机器学习&#xff1f; 机器学习的核…

【蓝桥杯省赛真题40】python摘苹果 中小学青少年组蓝桥杯比赛 算法思维python编程省赛真题解析

目录 python摘苹果 一、题目要求 1、编程实现 2、输入输出 二、算法分析 三、程序编写 四、程序说明 五、运行结果 六、考点分析 七、 推荐资料 1、蓝桥杯比赛 2、考级资料 3、其它资料 python摘苹果 第十三届蓝桥杯青少年组python编程省赛真题 一、题目要求 &…

二维码如何分享照片?3步在线生成相册二维码

拍摄的照片怎样快速分享给其他人呢&#xff1f;传统的图片传输方式多通过微信、QQ、空间、微博等方式来实现分享&#xff0c;当需要分享给指定人员时或者需要分享的图片数量较多时&#xff0c;这些方式传递起来并不是特别的方便。想要实现大量图片的分享&#xff0c;选择生成相…

docker教程(详细)

0 背景 软件开发最大的麻烦事之一&#xff0c;就是环境配置。环境配置如此麻烦&#xff0c;换一台机器&#xff0c;就要重来一次&#xff0c;旷日费时。很多人想到&#xff0c;能不能从根本上解决问题&#xff0c;软件可以带环境安装&#xff1f;也就是说&#xff0c;安装的时…

【JAVA进阶篇教学】第五篇:Java多线程编程

博主打算从0-1讲解下java进阶篇教学&#xff0c;今天教学第五篇&#xff1a;Java多线程编程。 在Java编程中&#xff0c;使用多线程可以提高程序的并发性能&#xff0c;但是直接创建和管理线程可能会导致资源浪费和性能下降。Java提供了线程池来管理线程的生命周期和执行任务…

Activiti——将绘制的流程图存入act数据库并进行流程推进与状态流转

文章目录 前言流程图入库操作 RepositoryService项目结构数据库连接配置文件入库Java测试代码zip 方式进行流程的批量部署 流程启动 RuntimeService待处理任务查看 TaskService流程状态的扭转查询流程定义信息 RepositoryService查询正在执行的流程实例 RuntimeService已部署流…
最新文章