Nginx Windows 安装 与 简单 vue 配置

时间:2024-03-27 12:55:07

1、下载地址

http://nginx.org/en/download.html

2、下载文件    

下载 Stable version 稳定版本里面的   windows版本

Nginx Windows 安装 与 简单 vue 配置

3、找到配置文件

conf =》nginx.conf

Nginx Windows 安装 与 简单 vue 配置

Nginx Windows 安装 与 简单 vue 配置

4、修改配置  修改 location 这一段

     listen       8888; #端口号

  # 读取文件地址

        location / {

            # root   html;

            index  index.html index.htm;

            #项目路径

            root  ;  #vue项目的打包后的dist文件路径; 

            try_files $uri $uri/ @router;#需要指向下面的@router否则会出现vue的路由在nginx中刷新出现404

            # 代理服务器

            proxy_pass ;  #代理服务地址 ;

        }

        #对应上面的@router,主要原因是路由的路径资源并不是一个真实的路径,所以无法找到具体的文件

        #因此需要rewrite到index.html中,然后交给路由在处理请求资源

        location @router {

            rewrite ^.*$ /index.html last;

        }

 

5、解压文件 点击运行 exe 文件 运行nginx

Nginx Windows 安装 与 简单 vue 配置

6、访问地址  http://localhost:8888/  可以正常使用了