Ubuntu 使用nginx部署agular项目

我的front-end是用的webpack,就直接执行的npm run build打包。

完成之后就可以\target\classes\static找到 ,直接把整个static上传到需要部署的地方就可以了。

当然这个打包output路径也是angular.json配置好了的

bash 复制代码
sudo apt update
sudo apt install nginx

安装完成之后查看一下状态

bash 复制代码
sudo systemctl status nginx

接下来新建项目配置文件,这个your_project就改成你的需要的名字

bash 复制代码
sudo nano /etc/nginx/sites-available/your_project 

然后修改配置,修改需要发布的端口,修改你项目打包好的地址,然后我还配置了一个代理,/api开头的都会被代理到5000端口。

python 复制代码
server {
    listen 9001;
    server_name 0.0.0.0;

    root /home/deploy-user/project_code/target/classes/static;  # 这里指定了你的项目文件所在的目录
    index index.html index.htm;  # 默认索引文件

    # 其他配置...

    location /api {
        proxy_pass http://localhost:5000;
    }

    # 其他location块...
}

创建符号链接以启用配置

bash 复制代码
sudo ln -s /etc/nginx/sites-available/your_project /etc/nginx/sites-enabled/  

然后执行检查配置是否正确

bash 复制代码
sudo nginx -t

看到这个就说明没问题了

然后就可以重启nginx了

bash 复制代码
sudo systemctl reload nginx  

然后就去浏览器访问你的ip+port就行了

相关推荐
木卫二号Coding1 小时前
推荐Linux统计文件大小并操作删除工具-ncdu
linux·运维·服务器
zhangrelay3 小时前
机械臂末端规划智能模型的误区演示
linux·笔记·学习·ubuntu·ros2
水饺编程3 小时前
第1章,了解乌班图环境,使用浏览器和邮箱
c语言·汇编·ubuntu
2601_967287574 小时前
轮胎侧壁上的 91V 是什么意思,负荷指数与速度级别怎么看
运维·服务器·汽车
Ivanqhz5 小时前
正余弦位置编码(Sinusoidal Positional Encoding)
java·linux·数据库
H.莓飛5 小时前
【数据结构】队列
linux·数据结构·centos
Ivanqhz5 小时前
层归一化、残差、前馈网络与激活函数简述
服务器·数据库·人工智能·深度学习·算法
小此方5 小时前
Linux网络(十九):TCP流量控制与滑动窗口详解,超时重传和快重传到底有什么区别
linux·运维·服务器·网络·网络协议·tcp/ip
码上有光5 小时前
Linux进程通信——共享内存、消息队列和信号量
android·linux·运维·共享内存·通信
沫璃染墨5 小时前
《从零入门Linux系统篇(五十四):线程篇·七——互斥锁底层原理:从原子交换到线程竞争与锁实现》
linux·运维·服务器·开发语言·c++·驱动开发·系统架构