CentOS 7 部署Nginx和前端框架

news2024/9/22 9:35:27

参考:
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/

eleadmin

七、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;
    }
}

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

jquery方法学习及案例

JQ框架入手须知封装方法学习及应用插件(白嫖超好用)总结案例推荐网课链接入手须知 1.进官网点3.6版本 2.复制全部代码 3.建立文档名为jquery.min.js,粘贴代码 (用的时候同cssjs引入) 封装方法学习及应用 介绍联系…

Authing,助力先进制造 10 万亿产值之路

工信部表示,截止今年 9 月,一批有竞争力的先进制造业集群正在形成。重点培育的 25 个先进制造业集群,其主导产业产值近 10 万亿元,其中的 17 个集群产值同比增速超过两位数。 Authing 深耕芯片、机器人、航空航天、医药医械等先进…

多品类多SKU存储的四向穿梭车|海格里斯HEGERLS超高RGV四向穿梭车供应

近年来,随着电商、快递的快速发展,物流行业也迎来了智能化、数字化转型。伴随上下游产业链条的智能化升级,物流机器人产品开始被普及、应用。在仓储物流领域,AGV(自动引导车)、AMR(自主移动机器…

2.编写第一个网页

第一个网页 ● 首先建立一个文件夹 ● 之后建立一个文件 ● 文件名称以.html结尾 ● 输入一个!,回车,就会生成一个html框架 ● 其他的部分不用看,稍后会介绍,看这个标签,英文的意思就是标题&#xff…

编写一个简版的数据库维护框架03-父窗口界面

框架的主要内容就是创建一个父类Form,实现基本逻辑。使用时,这些逻辑就无需用户实现。用户只需按照规则,设计好界面即可。 一、简版界面 界面如下: 界面分为两大部分,查询定位和数据维护 查询定位 查询定位将根据…

非极大值抑制NMS与柔性非极大抑制Soft-NMS的python实现

非极大值抑制NMS的python实现 什么是非极大值抑制 非极大值抑制的主要目的是为了消除多余的框,找到最佳的物体检测的位置。 比如我们想要检测手的时候, RCNN网络在训练之后会给出许多个预测框(比图上的更多), 我们先通过他们的置信度筛选出一批不符合的框, 剩下如图…

智能BI与传统报表的区别是什么?

随着企业信息化的深入, 企业的信息化系统日益增多。各个信息化系统也随着应用的逐渐深入, 随之产生大量的信息数据。面对已成几何级增长的数据量, 如何从中提取有效数据, 如何将数据转换为有价值的数据? 成为企业面临的问题之一。 其实与数据相关的工具除了传统报表还有如今火…

百度网盘普通用户如何上传单文件最大4G文件。window split命令如何分割文件上传。

普通用户使用百度网盘Web端上传文件时,单文件最大支持1G大小;使用网盘PC客户端上传文件时,单文件最大支持4G;如果您需要上传大于4G文件,可充值百度网盘会员,其中:1、百度网盘会员使用网盘PC客户…

案例:DNN进行分类

7.2 案例:DNN进行分类 学习目标 目标 知道tf.data.Dataset的API使用知道tf.feature_columnAPI使用知道tf.estimatorAPI使用应用 无 7.2.1 数据集介绍 对鸢尾花进行分类:概览 本文档中的示例程序构建并测试了一个模型,此模型根据鸢尾花的花…

《MFC编程》:MFC程序执行流程

《MFC编程》:MFC程序启动《MFC编程》:MFC程序启动入口函数执行流程CWinApp的成员视频链接《MFC编程》:MFC程序启动 入口函数 MFC程序的入口函数与win32程序一样,都是从WinMain入口。 但是MFC库已经实现了WinMain函数&#xff0…

ORA-65096: invalid common user or role 解决方法

问题描述 oracle 12C 创建数据库时报错: ORA-65096: invalid common user or role name例如: SQL> create user rui identified by oracle;create user rui identified by oracle* ERROR at line 1: ORA-65096: invalid common user or role name原…

记录1-两数之和

给定一个整数数组 nums 和一个整数目标值 target,请你在该数组中找出 和为目标值 target 的那 两个 整数,并返回它们的数组下标。你可以假设每种输入只会对应一个答案。但是,数组中同一个元素在答案里不能重复出现。你可以按任意顺序返回答案…

分享111个JS图片切换特效,总有一款适合您

分享111个图片切换,总有一款适合您 下面是文件的名字,我放了一些图片,文章里不是所有的图主要是放不下..., 111个图片切换下载链接:https://pan.baidu.com/s/1iGzOzU3WZbjBF21dZzoH9w?pwdqi5u 提取码:qi…

Linux常见指令大全(二)

🌹作者:云小逸 📝个人主页:云小逸的主页 📝Github:云小逸的Github 🤟motto:要敢于一个人默默的面对自己,强大自己才是核心。不要等到什么都没有了,才下定决心去做。种一颗树,最好的时间是十年前…

2023年第一篇来谈谈效率

晚上临走的时候和同事聊了聊关于效率的问题,暂且称呼为A同学。借着和A同学的这次畅谈记录下这段时间的所负责的数据迁移过程。 数据迁移的整体内容并不复杂。主要内容如下 我们在做事情的时候总会遇到这件事情所关联的其他问题。 不要带着情绪去工作 书写脚本的时候…

【HBase高级】6. HBase数据结构(下)——LSM树数据结构、布隆过滤器、StoreFiles(HFile)结构

5.3 LSM树数据结构 1、简介 传统关系型数据库,一般都选择使用B树作为索引结构,而在大数据场景下,HBase、Kudu这些存储引擎选择的是LSM树。LSM树,即日志结构合并树(Log-Structured Merge-Tree)。 LSM树主要目标是快速建立索引B树…

redis加锁的几种方法

1. redis加锁分类 redis能用的的加锁命令分表是INCR、SETNX、SET 2. 第一种锁命令INCR 这种加锁的思路是, key 不存在,那么 key 的值会先被初始化为 0 ,然后再执行 INCR 操作进行加一。 然后其它用户在执行 INCR 操作进行加一时,…

3.4 内部类

文章目录1.概述2.特点3.内部类入门案例4.成员内部类4.1 被private修饰4.2 被static修饰5.局部内部类6.匿名内部类1.概述 如果一个类存在的意义就是为指定的另一个类,可以把这个类放入另一个类的内部。 就是把类定义在类的内部的情况就可以形成内部类的形式。 A类中…

【内网安全】——CS操作指南(二)

作者名:白昼安全主页面链接: 主页传送门创作初心: 一切为了她座右铭: 不要让时代的悲哀成为你的悲哀专研方向: web安全,后渗透技术每日emo:关心和细节吗?注意:我这里的cs…

Android MVI框架的使用

AndroidMviFrame AndroidMviFrame 是一个Android简单易用的项目框架 文档下面会对框架中所使用的一些核心技术进行阐述。该框架作为技术积累的产物,会一直更新维护,如果有技术方面的谈论或者框架中的错误点,可以在 GitHub 上提 Issues&…