Vue.js 如何设置nginx以解决静态文件vue上找不到的404问题？

我正在使用nginx运行我的项目。因此，我将nginx安装到本地主机来测试它

我在localhost上的nginx配置如下：

location / {
    root   html;
    index  index.html index.htm;
}

404 Not Found
nginx/1.14.0 (Ubuntu)

location / {
    root /www/dist;
    try_files $uri /index.html;
}

location / {
    root /www/dist;
    try_files $uri /index.html;
}

location /startup {
    root /www/dist;
    try_files $uri /index.html;
}

404 Not Found
nginx/1.14.0 (Ubuntu)

如果刷新页面，则会出现如下错误：

location / {
    root   html;
    index  index.html index.htm;
}

404 Not Found
nginx/1.14.0 (Ubuntu)

location / {
    root /www/dist;
    try_files $uri /index.html;
}

location / {
    root /www/dist;
    try_files $uri /index.html;
}

location /startup {
    root /www/dist;
    try_files $uri /index.html;
}

404 Not Found
nginx/1.14.0 (Ubuntu)

我在谷歌上搜索，得到了一些参考资料。我试着这样：

location / {
    root   html;
    index  index.html index.htm;
}

404 Not Found
nginx/1.14.0 (Ubuntu)

location / {
    root /www/dist;
    try_files $uri /index.html;
}

location / {
    root /www/dist;
    try_files $uri /index.html;
}

location /startup {
    root /www/dist;
    try_files $uri /index.html;
}

404 Not Found
nginx/1.14.0 (Ubuntu)

我工作。没有错误

然后我将项目部署到生产环境中

我的nginx生产配置如下：

location / {
    root   html;
    index  index.html index.htm;
}

404 Not Found
nginx/1.14.0 (Ubuntu)

location / {
    root /www/dist;
    try_files $uri /index.html;
}

location / {
    root /www/dist;
    try_files $uri /index.html;
}

location /startup {
    root /www/dist;
    try_files $uri /index.html;
}

404 Not Found
nginx/1.14.0 (Ubuntu)

它也有效

但我的问题是我需要将位置更改为这样：

location / {
    root   html;
    index  index.html index.htm;
}

404 Not Found
nginx/1.14.0 (Ubuntu)

location / {
    root /www/dist;
    try_files $uri /index.html;
}

location / {
    root /www/dist;
    try_files $uri /index.html;
}

location /startup {
    root /www/dist;
    try_files $uri /index.html;
}

404 Not Found
nginx/1.14.0 (Ubuntu)

我在nginx有很多项目。因此，我必须添加

/startup

，以显示它是一个启动项目。但它会产生如下错误：

location / {
    root   html;
    index  index.html index.htm;
}

404 Not Found
nginx/1.14.0 (Ubuntu)

location / {
    root /www/dist;
    try_files $uri /index.html;
}

location / {
    root /www/dist;
    try_files $uri /index.html;
}

location /startup {
    root /www/dist;
    try_files $uri /index.html;
}

404 Not Found
nginx/1.14.0 (Ubuntu)

---

如何解决此问题？

在nginx中使用

root

时，它总是将路由附加到文件路径的末尾，但在使用

/

时，这并不明显。因此，在第一个使用

location/

的示例中，它会在服务器上搜索以下路径：

root + /www/dist + /

但是当您使用

位置/启动

时，它会查找不存在的路径：

root + /www/dist + /startup

因此，要同时使用

root

和“/startup”，您需要一个名为“startup”的目录。 但是，您可以使用别名。试试这个：

location /startup {
    alias /www/dist;
    try_files $uri $uri/ /startup/index.html;
}

---

他们也推荐类似的东西。（但它们没有显示如何使用子文件夹

alias

）

我这样尝试：

location/startup/{alias/www/dist；try_files$uri/index.html；}

。但它不起作用。这是sameI使用

try_文件

解决

404未找到问题的方法。如果我不使用它，它似乎不起作用。我在本地主机上试用过它，它就起作用了。但稍后我将在生产服务器上尝试。如果成功的话，我会接受你的回答。我身上任何好的东西都是上帝做的，谢谢你的鼓励。我链接了Vue路由器文档，并使用
alias
，稍微调整了答案以匹配文档建议的方式。是的，仍然是alias。现在唯一的区别是使用
$uri$uri/
而不仅仅是
$uri
签出和