CentOS 7 部署Nginx和前端框架
CentOS 7 部署Nginx和前端框架
星空你好
于2023-02-03 22:46:33发布
333
收藏
2
分类专栏:
运维
linux
web前端
文章标签:
nginx
centos
前端框架
运维
同时被 3 个专栏收录
1 篇文章
0 订阅
订阅专栏
linux
1 篇文章
0 订阅
订阅专栏
web前端
29 篇文章
0 订阅
订阅专栏
参考: Centos 7下安装配置Nginx-阿里云开发者社区 (aliyun.com) 阿里P8架构大牛整理的Nginx 从入门到实践,万字详解 安装nginx之后,处理 conf.d下无default.conf文件
1. CentOS 7 下安装配置 Nginx 一、配置 EPEL 源 sudo yum install -y epel-release sudo yum -y update 二、安装 Nginx sudo yum install -y nginx安装成功后,默认的网站目录为: /usr/share/nginx/html
默认的配置文件为:/etc/nginx/nginx.conf
自定义配置文件目录为: /etc/nginx/conf.d/
也可以通过一下命令查看 Nginx 被安装到了什么地方,有哪些相关的目录:
rpm -ql nginx 三、开启端口80和443如果你的服务器打开了防火墙,你需要运行以下命令,放行80和443端口。
sudo firewall-cmd --permanent --zone=public --add-service=http sudo firewall-cmd --permanent --zone=public --add-service=https sudo firewall-cmd --reload # 验证端口是否放行 firewall-cmd --list-all 四、操作 Nginx # 查看nginx版本 nginx -v # 启动nginx systemctl start nginx # 停止nginx systemctl stop nginx # 重启nginx systemctl restart nginx # 查看nginx状态 systemctl status nginx # 开机启动nginx systemctl enable nginx # 关闭开机启动nginx systemctl disable nginx # 重载 nginx 配置文件 systemctl reload nginx # 或者 nginx -s reload # 测试 nginx 配置(在重新启动或重新加载服务之前测试配置) nginx -t 五、前端文件打包 npm run build # 打包演示环境包,会加载 .env.preview 配置文件 npm run build:preview # 如果需要生成打包分析图 npm run build:report 六、复制文件到网站根目录复制dist.zip文件到网站根目录(/usr/share/nginx/html)
unzip -d /usr/share/nginx/html/ /root/Desktop/dist.zip此时可以预览,http://localhost/
七、Nginx配置在 /etc/nginx/nginx.conf文件中增加配置:
http { # 在http下面增加这一段 server { # 这里配置端口 listen 8080; server_name localhost; location / { # 加这个是支持history的路由模式,很重要,不然刷新会404 try_files $uri $uri/ /index.html; # 这里配置项目位置 root C:/webapp/eleadmin; index index.html index.htm; } } }开启gzip功能
项目打包后一般都有一两个核心的 js 体积会很大,推荐 nginx 服务器开启 gzip 功能,gzip 可以压缩 3-5 倍左右, 能够大幅度优化首屏加载的速度,ele-admin 已经配置了打包生成 gzip 文件,只需要给 nginx 增加如下配置:
server { listen 80; server_name demo.eleadmin.com; # 开启gzip功能 gzip on; gzip_min_length 10k; gzip_comp_level 9; gzip_types text/plain text/css application/javascript application/x-javascript text/javascript application/xml; gzip_vary on; gzip_disable "MSIE [1-6]\."; location / { try_files $uri $uri/ /index.html; root C:/webapp/eleadmin; index index.html index.htm; } }