# Firebase 部署 VUE 项目刷新后 404 错误

**URL:** <https://www.isharkfly.com/t/firebase-vue-404/16398>\
**Category:** DevOps\
**Tags:** firebase, vue\
**Created:** [October 7, 2024, 9:25pm UTC](https://www.isharkfly.com/t/firebase-vue-404/16398 "2024-10-07T21:25:34Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![honeymoose](https://www.isharkfly.com/user_avatar/www.isharkfly.com/honeymoose/32/20796_2.png) [@honeymoose](https://www.isharkfly.com/u/honeymoose)\
**Post date:** [October 7, 2024, 9:25pm UTC](https://www.isharkfly.com/t/firebase-vue-404/16398/1 "2024-10-07T21:25:35Z")

</div>

通过正常的单击打开的页面可以正常访问，但如果刷新的话，显示 404 错误。

 ![2024-10-07_17-23-12](https://cdn.isharkfly.com/com-isharkfly-www/discourse-uploads/original/2X/d/db1b0c6985343f7441928929a2a262addb0abeb5.png)

生成错误的录屏。

## 问题和解决

这个错误的原因标识 VUE 在 Firebase 中的重定向问题。

使用的 `firebase.json` 文件格式如下：

```auto
{
  "database": {
    "rules": "database.rules.json"
  },
  "hosting": {
    "public": "dist",
    "ignore": [
      "firebase.json",
      "**/.*",
      " **/node_modules/**"
    ]
  }
}

```

需要把这个文件修改为：

```auto
{
  "database": {
    "rules": "database.rules.json"
  },
  "hosting": {
    "public": "dist",
    "ignore": [
      "firebase.json",
      "**/.*",
      " **/node_modules/**"
    ],
    "rewrites": [
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
  }
}

```

添加了重定向的配置。

然后再次刷新页面就没有问题。