nginx托管静态生成站点需区分根路径与子路径：根路径用root+try_files $uri $uri/ =404；子路径（如/docs/）必须用末尾带斜杠的alias并配try_files $uri $uri/index.html，确保spa路由正确回退至index.html。
用 Nginx 的 location 托管静态页面生成工具（比如 Hugo、Next.js export、VuePress、Jekyll 等）输出的目录，核心是让 Nginx 准确识别请求路径，并把对应文件从指定本地目录中读取返回，不经过后端或重定向。
明确静态输出目录位置
静态生成工具最终会输出一个纯文件目录（如 public/、dist/、out/ 或 _site/），里面包含 index.html 及 CSS/JS/图片等资源。你需要先确认这个目录在服务器上的绝对路径，例如：
/var/www/my-hugo-site/public/opt/app/dist-
/usr/share/nginx/html（Nginx 默认根目录，可直接复用）
基础 location 配置：根路径托管
若想通过 https://example.com/ 直接访问该静态站点，最简配置如下：
location / {
root /var/www/my-hugo-site/public;
index index.html;
try_files $uri $uri/ =404;
}
说明：
-
root指定的是“上级目录”，Nginx 会自动拼接location路径；所以root /var/www/.../public+location /→ 实际查找/var/www/.../public/index.html -
try_files是关键：它按顺序检查文件是否存在，避免因 SPA 路由导致子路径（如/about）返回 404 - 不要用
alias替代root这里——alias在location /下易出错，语义易混淆
子路径托管：多站点共存时的写法
如果静态站点需部署在子路径下（如 https://example.com/docs/），必须用 alias 并注意末尾斜杠：
location /docs/ {
alias /opt/app/docs-site/;
index index.html;
try_files $uri $uri/index.html =404;
}
注意点：
-
alias后路径必须以/结尾，且它会**完全替换**location匹配部分（/docs/被替换成/opt/app/docs-site/） -
try_files $uri $uri/index.html更适合子路径场景，能正确处理无后缀的路由（如/docs/guide→ 查找/opt/app/docs-site/guide/index.html） - 别漏掉
index index.html，否则访问/docs/会失败
SPA 路由兼容：防止 404 刷新问题
多数静态生成工具支持 HTML5 History 模式（如 Vue Router、Next.js export 的 trailingSlash: true 场景），此时直接访问 /user/123 会 404。解决方法是在 try_files 中兜底到 index.html：
location / {
root /var/www/my-app/dist;
try_files $uri $uri/ /index.html;
}
这样所有未命中真实文件的请求，都会返回根 index.html，交由前端路由接管。
配置完记得 nginx -t 测试语法，再 nginx -s reload 生效。路径权限、SELinux、防火墙这些外围问题也要同步检查。
