前言

记录一下前端项目的部署，主要最近也在做这些事情。

一、tomcat部署前端

这里我使用的事linux环境，windows下类似。

1、下载tomcat

tomcat下载官网

版本很多，下载常用的支持Java8的就行。

选择对应系统类型的文件

2、查看tomcat目录

我下载的是Linux版本，windows版本也类似。

tomcat的目录如下。

重点，两步就能部署起项目

我们把前端的项目解压，放到tomcat目录下的webapps下。

例如：我在webapps下存放了cloud名称的前端项目。
在tomcat目录下的bin目录下，启动tomcat（运行startup.sh）

访问路径，tomcat默认端口是8080，如果占用问题修改启动端口即可。

于是访问的路径http://localhost:8080/cloud/index.html

二、使用nginx部署

nginx是一个轻量级的服务器，不经可以作为普通的服务器，还可以作为反向代理服务器，同时支持负载均衡、动静资源分离等等。这里只说部署前端项目。

这里我演示的windows版本，linux下类似

1、概述

1.1 nginx常用命令

1.查看nginx版本号
./nginx -v
2.启动nginx
./nginx
3.关闭nginx
./nginx -s stop
4.重新加载nginx
./nginx -s reload

2、下载nginx

下载地址，说明：

按需下载即可。

3、目录了解

下载文件后，解压

我们把项目放到html文件夹下。比如：

4、配置项目

打开conf目录，编辑nginx.conf文件

我们在http层级下，有一个server层级，修改里面的内容。

把这个路径改成我们项目的路径即可，比如html/dist。

简单说明一下：

server下的属性

linsten 说明服务启动的端口
server_name 启动的访问域名
location / 虚拟地址/，网络地址映射为/根目录

nginx是一个好用的服务器，有兴趣找资料可以了解下。

参考或相关文章

https://segmentfault.com/a/1190000022689642

https://tomcat.apache.org/download-90.cgi

https://docs.nginx.com/nginx/

简单Tomcat和Nginx部署前端项目相关推荐

win10 nginx部署前端项目（静态资源服务器和HTML）
win10 nginx部署前端项目(静态资源服务器和HTML) niginx的安装和启停操作参照博客:https://blog.csdn.net/qq_26666947/article/details ...
nginx 部署前端项目，不缓存html文件，项目发版后，不用手动刷新页面
nginx 部署前端项目,不缓存html文件,项目发版后,不用手动刷新页面 location / {expires 1h;root /home/test/vue/dist/;index index.h ...
使用nginx部署前端项目
目录安装Nginx 1.下载docker的nginx镜像 2.查看下载完成的镜像 3.运行一个nginx的镜像的实例 4.进入nginx容器 5.在物理机创建对应文件夹 6.拷贝容器中的对应的文件夹 ...
Docker利用Nginx部署前端项目
今天给大家分享的是Docker利用Nginx部署Vue等前端页面项目:其实是我工作刚好用到,顺便分享给大家O(∩_∩)O,那么话不多说直接开始. 一:准备文件我们先将前端项目打包好,放到此文件夹下, ...
docker nginx部署前端项目
最近一直在搞前后端分类,一直在想前端的html页面应该用什么部署想来想去,如果用tomcat好像有点浪费资源,作为程序员自然要时时刻刻追求新的东西一直以来都是在apache tomcat上面运行, ...
nginx部署前端项目的详细步骤
前言在前端开发过程中经常是需要把前端静态资源放到服务器中看效果,这时经常用到nginx来配置. 1. 什么是nginx Nginx是一款高性能的http 服务器/反向代理服务器及电子邮件(IMAP/ ...
Nginx 部署前端项目dist文件
写好的项目 npm run build 生成的dist文件夹放桌面备用下载nginx后将dist文件夹放入html文件夹中进入conf修改配置里面有nginx.conf 文本修改下面s ...
部署前端项目的几种方案并探讨优缺点
前端部署作为大前端的知识体系的一部分,是不可或缺的.如果作为软件开发工程师的你开发了一个网站,却不会部署上线,还有请别人帮忙,那知识面确实要扩充下了.而且作为一名前端开发,避免不了与运维部署的同事调试 ...
踩坑：云服务器Nginx部署前端遇到http与https问题
问题:nginx部署前端项目,修改配置文件路径后,页面一直无法加载css.js.img 解决:看了一堆博客都没有解决,最后是发现https访问的css.js等资源导致. 解决方案1::如果没理解错的话 ...

简单Tomcat和Nginx部署前端项目

前言