征服Windows版nginx（2）

1.配置Nginx

编辑Nginx的配置文件（通常是nginx.conf），找到安装Nginx位置，如下路径：

D:\nginx-1.26.2\conf

双击打开nginx.CONF编辑，在http块中添加一个新的server块，用于指定Vue项目的静态文件目录和端口。例如，假设你的Vue项目构建后的静态文件被放置在D:\vue_projects\my-project\dist目录下，你可以这样配置：

http {
    server {
        listen       80;
        server_name  localhost;
 
        location / {
            #root后面是你打包vue项目位置路径
            root   D:/vue_projects/my-project/dist;
            index  index.html index.htm;
            try_files $uri $uri/ /index.html;
        }
    }
}

2.重启Nginx

打开任务管理器结束Nginx.exe的所有进程后，重新进入安装Nginx位置，右键以管理员身份运行

运行后可打开任务管理器查看，成功后可以看到两个nginx.exe的进程，代表nginx重启成功。

3.访问Vue项目

现在打开浏览器，访问http://localhost，应该就能看到你的Vue项目（注：这里是80端口默认没写，如更换其他端口请在后面加上端口号，如http://localhost:8000）。

注意：确保Nginx的配置文件中的路径是正确的，并且Vue项目已经构建完成。如果你的Vue项目使用了history模式的路由，还需要确保Nginx配置中有正确的try_files指令来处理路由。

原文地址：https://blog.csdn.net/kana_yonk/article/details/145105120

免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！