小知识:服务器使用Nginx部署Vue项目

首先得购买个服务器,在这就不教怎么购买了,本文章使用的是阿里云轻量级服务器centos7.6

一、安装nginx

1. 使用xshell连接我们的服务器

2. 配置 epel源

?
1
2
sudo yum install -y epel-release
sudo yum -y update

3. 安装nginx

?
1
sudo yum install -y nginx

以下的内容需要记住,特别是配置文件

安装成功后,默认的网站目录为: /usr/share/nginx/html

默认的配置文件为:/etc/nginx/nginx.conf

4. 开启端口80和443

前提是要先打开防火墙

?
1
systemctl start firewalld.service

重启防火墙:firewall-cmd –reload

查看防火墙状态firewall-cmd –state

关闭防火墙systemctl stop firewalld.service

开启端口firewall-cmd –add-port=8890/tcp –permanent (8890替换为要开启的那个端口)

开启80和443firewall-cmd –permanent –zone=public –add-service=httpfirewall-cmd –permanent –zone=public –add-service=https

开启后要记得重启防火墙 5. 服务器开启80和443端口号

打开服务器,点击防火墙,然后点击添加规则

%小知识:服务器使用Nginx部署Vue项目-猿站网-插图

在端口范围那里添加我们需要的就行了,这里我们就添加80和443

%小知识:服务器使用Nginx部署Vue项目-1猿站网-插图

6. nginx 基本命令

启动:systemctl start nginx

重启:systemctl restart nginx

关闭:systemctl stop nginx

查看状态:systemctl status nginx

开启开机自动启动:systemctl enable nginx

关闭开机自动启动:systemctl disable nginx

7. 验证是否安装成功

在电脑浏览器输入服务器的ip地址,出现欢迎到nginx就代表成功了,那么就可以下一步了

%小知识:服务器使用Nginx部署Vue项目-2猿站网-插图

二、部署vue

1. 打包vue项目

?
1
npm run build // 这个看情况 如果是版本那么就根据情况

2. 上传到服务器

我们这里是把这个放到了 /usr/local/webapp这个文件夹里面

我们可以使用xftp进行上传

%小知识:服务器使用Nginx部署Vue项目-3猿站网-插图

3. nginx配置

执行 vim /etc/nginx/nginx.conf命令 进入配置文件

%小知识:服务器使用Nginx部署Vue项目-4猿站网-插图

这样我们的vue就部署完成了

记得重启一下nginx

4. 测试

在浏览器输入我们服务器的ip地址加上端口号就可以了

%小知识:服务器使用Nginx部署Vue项目-5猿站网-插图

如果是其他端口那么就要考虑服务器和阿里云有没有开放该端口号

到此这篇关于服务器使用nginx部署vue项目的文章就介绍到这了,更多相关nginx部署vue项目内容请搜索服务器之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持服务器之家!

原文链接:https://blog.csdn.net/weixin_51444617/article/details/123783454

声明: 猿站网有关资源均来自网络搜集与网友提供,任何涉及商业盈利目的的均不得使用,否则产生的一切后果将由您自己承担! 本平台资源仅供个人学习交流、测试使用 所有内容请在下载后24小时内删除,制止非法恶意传播,不对任何下载或转载者造成的危害负任何法律责任!也请大家支持、购置正版! 。本站一律禁止以任何方式发布或转载任何违法的相关信息访客发现请向站长举报,会员发帖仅代表会员个人观点,并不代表本站赞同其观点和对其真实性负责。本网站的资源部分来源于网络,如有侵权烦请发送邮件至:2697268773@qq.com进行处理。
建站知识

小知识:Linux中mv命令的高级用法示例

2023-3-17 1:56:13

建站知识

小知识:Linux下安装Python3.6及避坑指南

2023-3-17 2:04:24

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索