在Firebase上重新加载Angular页面时找不到页面

Question

我已将我的角度应用程序部署到firebase.我可以看到登录页面很好,但是当我重新加载页面时出现以下错误:

This file does not exist and there was no index.html found in the current directory or 404.html in the root directory.

Why am I seeing this?

You may have deployed the wrong directory for your application. Check your firebase.json and make sure the public directory is pointing to a directory that contains an index.html file.
You can also add a 404.html in the root of your site to replace this page with a custom error page.

因为错误建议我检查了我的firebase.json文件,它显示了这个:

{
  "firebase": "******",
  "public": "dist",
  "ignore": [
    "firebase.json",
    "**/.*",
    "**/node_modules/**"
  ]
}

在这里你可以看到我的public文件夹是我的dist文件夹.这个dist文件夹实际上是我放置所有文件(css,js,html和index.html)的地方,当gulp构建它时.文件夹结构如下所示:

dist
  css
  images
  js
  templates
  index.html

所以上面的目标文件夹确实有一个index.html页面 - 所以我为什么会收到这个错误？Angular应该踩到这里并处理所有路由,但似乎并非如此.

编辑

Answer 1

我解决了这个问题 - 这个问题是由Firebase(我认为所有服务器)都认为每个Angular状态都是一个应该包含自己index.html文件的文件夹引起的- 显然情况并非如此.

需要做的是它只能index.html在文件夹的根目录中引用我们的内容.为此,您需要将firebase.json文件修改为以下内容:

{
  "firebase": "app-name",
  "public": "dist",
  "ignore": [
    "firebase.json",
    "**/.*",
    "**/node_modules/**"
  ],
  "rewrites": [{
    "source": "/public/**",
    "destination": "/public.html"
  },
  {
    "source": "**",
    "destination": "/index.html"
  }]
}

这里的重要部分是重写和源对象.firebase.json有关详细信息,请参阅说明页面:firebase.json

Answer 2

2018 并有同样的问题。Katana24 给出了一个很好的答案，但从那以后，firebase 更新了一点。这是更新的 Katana24 答案：

firebase.json：

{
"functions": {
    "predeploy": [
        "npm --prefix \"%RESOURCE_DIR%\" run lint"
    ],
    "source": "functions"
},
"hosting": {
    "public": "dist/YOURAPPNAME",
    "ignore": [
        "firebase.json",
        "**/.*",
        "**/node_modules/**"
    ],
    "rewrites": [{
            "source": "/public/**",
            "destination": "/public.html"
        },
        {
            "source": "**",
            "destination": "/index.html"
        }
    ],
    "storage": {
        "rules": "storage.rules"
    }
}
}

Answer 3

如果您使用firebase-tools，您可以在问题上按y（是）：

配置为单页应用程序（将所有 url 重写为 /index.html）？