nigix部署vue项目

### 如何配置 Nginx 以部署 Vue.js 应用

#### 安装必要的软件环境
为了顺利部署 Vue.js 应用程序，需确保服务器环境中已安装 Linux 操作系统（如 Ubuntu 或 CentOS），以及 Node.js 和 npm 来支持 Vue 项目的构建过程[^2]。

#### 构建生产版本的应用
完成开发后的 Vue.js 项目应通过 `npm run build` 或者 `yarn build` 命令来创建优化过的静态资源文件夹 dist/ 。此操作会生成适合上线发布的 HTML 文件、CSS 及 JavaScript 资源等。对于防止浏览器缓存旧版 js 等文件的问题，可以通过引入文件名版本号机制加以处理[^3]。

#### 设置 Nginx 配置文件
编辑位于 `/etc/nginx/sites-available/default` （Debian/Ubuntu）或 `/etc/nginx/conf.d/default.conf` (CentOS/RHEL) 中默认站点配置文件，添加如下所示的 server 块：

server {
    listen       80;
    server_name  localhost;

    location / {
        root   /path/to/dist; # 替换成实际dist路径
        try_files $uri $uri/ /index.html;
        index  index.html index.htm;
    }

    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   html;
    }
}

这段配置实现了当请求未匹配任何具体文件时自动重定向至根页面的功能，从而解决了单页应用(SPA)路由模式下的刷新问题[^1]。

#### 启动并验证 Nginx 服务
最后，在确认所有设置无误之后，重启 Nginx 使更改生效；如果是在 Windows 上，则可通过命令行进入 Nginx 的安装目录执行 `start nginx.exe` 来启动服务[^4]。