在vercel部署项目时除首页外刷新报404

问题

最近在vercel上部署Vue3项目时,在除了首页外的页面刷新时会报404,如图:

原因

这是因为vercel的路由配置问题,vercel默认会将所有的请求都重定向到首页,所以在刷新页面时会报404。

解决方法

在public文件夹下创建一个_redirects文件,然后在文件中添加以下内容:

bash 复制代码
/* /index.html 200

在项目根目录下创建一个vercel.json文件,然后在文件中添加以下内容:

json 复制代码
{
  "rewrites": [
    {
      "source": "/(.*)",
      "destination": "/$1"
    }
  ]
}

然后等待vercel重新部署项目即可。

相关推荐
前端小巷子5 分钟前
跨域问题解决方案:开发代理
前端·javascript·面试
前端_逍遥生5 分钟前
Chrome 插件开发到发布完整指南:从零开始打造 TTS 朗读助手
前端·chrome
Mintopia5 分钟前
Three.js 材质与灯光:一场像素级的光影华尔兹
前端·javascript·three.js
天涯学馆6 分钟前
JavaScript 跨域、事件循环、性能优化面试题解析教程
前端·javascript·面试
掘金一周15 分钟前
别再用 100vh 了!移动端视口高度的终极解决方案| 掘金一周7.3
前端·后端
晴殇i17 分钟前
CSS 迎来重大升级:Chrome 137 支持 if () 条件函数,样式逻辑从此更灵活
前端·css·面试
源码站~19 分钟前
基于Flask+Vue的豆瓣音乐分析与推荐系统
vue.js·python·flask·毕业设计·毕设·校园·豆瓣音乐
咚咚咚ddd19 分钟前
cursor mcp实践:网站落地页性能检测报告(browser-tools)
前端
MiyueFE20 分钟前
让我害怕的 TypeScript 类型 — — 直到我学会了这 3 条规则
前端·typescript
Hilaku20 分钟前
2025年,每个前端都应该了解的CSS选择器:`:has()`, `:is()`, `:where()`
前端·css