嘿，这个问题我之前部署Vue项目时也踩过坑！你遇到的情况核心原因是用了Vue Router的history模式，而Nginx默认会把多级URL（比如/dashboard/new/create）当成真实的文件目录去查找——服务器上根本不存在这个路径对应的文件，所以直接返回404；而单级路径/design-dashboard能正常访问，大概率是Nginx默认把找不到的单级路径转发到了index.html，但多级路径的处理逻辑不一样。

核心解决方案：修改Nginx配置 #

你需要在Nginx的站点配置里添加try_files指令，让所有请求都转发到Vue项目的index.html，交给Vue Router来处理路由匹配。

具体的Nginx配置示例如下：

server {
    listen 80;
    server_name your-domain-or-ip; # 替换成你的域名或服务器IP

    # 指向Vue项目打包后的dist目录
    root /usr/share/nginx/html/your-project-dist; # 替换成实际的dist路径
    index index.html index.htm;

    # 关键配置：处理所有路由请求
    location / {
        try_files $uri $uri/ /index.html;
    }

    # 可选：给静态资源设置缓存，提升加载速度
    location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg)$ {
        expires 12h;
        add_header Cache-Control "public, max-age=43200";
    }
}

配置说明 #

• try_files $uri $uri/ /index.html：Nginx会先尝试访问当前URL对应的文件（$uri），找不到就尝试访问对应的目录（$uri/），如果两者都不存在，就直接返回index.html——这样Vue Router就能接管所有路由的解析，包括多级路径的直接访问和刷新操作。
• 静态资源的缓存配置是可选的，能减少重复请求，优化用户体验。

后续操作 #

1. 把上述配置替换到你的Nginx站点配置文件中（通常在/etc/nginx/conf.d/或/etc/nginx/sites-available/目录下）
2. 检查配置是否有语法错误：sudo nginx -t
3. 重启Nginx使配置生效：sudo nginx -s reload

如果你的Vue项目是部署在域名的子路径下（比如https://your-domain.com/app/），那需要调整try_files的最后一个参数为/app/index.html，同时Vue Router的base属性也要设置为'/app/'——不过看你的路由配置是根路径，这个情况暂时不用考虑~

内容的提问来源于stack exchange，提问作者Jhon Lemmon