在 Windows系统中安装、卸载Nginx,及部署Vue项目在Nginx中

本文详细介绍了如何在Windows系统中安装Nginx,包括下载稳定版,解压到非中文目录,启动Nginx服务以及检查端口配置。接着,文章讲述了如何部署Vue项目到Nginx,涉及将dist文件放入html目录并修改配置文件。最后,还提供了卸载Nginx的步骤,包括停止进程和删除相关文件。
摘要由CSDN通过智能技术生成

Windows系统中安装Nginx,及部署Vue项目在Nginx中

一、安装Nginx教程

  1. 官网下载地址:下载地址
  2. 下载教程:选择Stable version版本下载到本地
    在这里插入图片描述
  3. 下载完成后,解压放入本地非中文的文件夹中:

在这里插入图片描述

  1. 启动nginx:双击nginx.exe,若双击未弹出内容,则说明端口被占用,请参照第6步
    在这里插入图片描述
  • 双击nginx.exe后出现在任务管理器中:
    在这里插入图片描述
  • 或者使用命令行:输入start nginx
    在这里插入图片描述
  • 使用命令出现在任务管理器中:在这里插入图片描述
  1. 查看是否启动成功:在浏览器输入:http://localhost:3005,能看到以下界面说明启动成功
    在这里插入图片描述

  2. 打开conf文件夹下的nginx.conf查看端口占用情况:

(1)nginx默认使用80端口

 server {
        #listen       80; //默认使用该端口
        server_name   localhost;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        location / {
            root   html;
            index  index.html index.htm;
        }

        #error_page  404              /404.html;

        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }

        # proxy the PHP scripts to Apache listening on 127.0.0.1:80
        #
        #location ~ \.php$ {
        #    proxy_pass   http://127.0.0.1;
        #}

        # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
        #
        #location ~ \.php$ {
        #    root           html;
        #    fastcgi_pass   127.0.0.1:9000;
        #    fastcgi_index  index.php;
        #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
        #    include        fastcgi_params;
        #}

        # deny access to .htaccess files, if Apache's document root
        # concurs with nginx's one
        #
        #location ~ /\.ht {
        #    deny  all;
        #}
    }

(2)端口被占用则自定义端口:

 server {
        #listen       80;
		listen        3005; //这里修改为3005端口了
        server_name   localhost;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        location / {
            root   html;
            index  index.html index.htm;
        }

        #error_page  404              /404.html;

        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }

        # proxy the PHP scripts to Apache listening on 127.0.0.1:80
        #
        #location ~ \.php$ {
        #    proxy_pass   http://127.0.0.1;
        #}

        # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
        #
        #location ~ \.php$ {
        #    root           html;
        #    fastcgi_pass   127.0.0.1:9000;
        #    fastcgi_index  index.php;
        #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
        #    include        fastcgi_params;
        #}

        # deny access to .htaccess files, if Apache's document root
        # concurs with nginx's one
        #
        #location ~ /\.ht {
        #    deny  all;
        #}
    }

二、部署Nginx教程

  1. 将打包的dist文件放入nginx-1.22.1目录下的html文件夹中:

在这里插入图片描述

  1. 修改server:在nginx.conf文件中修改server(即部署后的地址)
    在这里插入图片描述

  2. 再次打开http://localhost:3005,若出现如下图所示,则说明项目已经成功部署

在这里插入图片描述

注意:若是项目需要连接后端项目,切记不要关闭后端项目哦,后端项目要跑起来哦,这样整个LAN网络内均可以使用哦,其他pc访问所使用的地址:http://本机IP地址:端口号

至此项目部署步骤完成

三、卸载Nginx

  1. 查看与nginx相关的端口:tasklist /fi "imagename eq nginx.exe" netstat -ano |findstr 3005 //查看3005端口信息
    在这里插入图片描述
    在这里插入图片描述
    在这里插入图片描述

  2. 停止nginx进程:taskkill /f /t /im "nginx.exe"在这里插入图片描述

  3. **直接删除nginx相关文件:**点击Nginx相关文件夹 - 右键 - 删除即可

看到大家有说出现闪的问题(在文件夹双击nginx.exe的时候出现的),没事的哦,只要在任务管理器中有看到在nginx在运行就可以,安装过程中有问题可以私聊我哦

评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值