Umi&React打包部署项目刷新报404错误的几种解决方法 - 腾讯云开发者社区-腾讯云腾讯云备案控制台开发者社区学习实践活动专区工具TVP文章/答案/技术大牛搜索搜索关闭写文章提问登录/注册德顺普联软件 · 前端开发工程师 (已认证)530 篇文章Umi&React打包部署项目刷新报404错误的几种解决方法转到我的清单专栏首页前端资源Umi&React打包部署项目刷新报404错误的几种解决方法40分享分享文章到朋友圈分享文章到 QQ分享文章到微博复制文章链接到剪贴板海报分享海报分享Umi&React打包部署项目刷新报404错误的几种解决方法发布于2021-09-10 14:27:19阅读 4K0【推荐】SMS MAN：相当不错的接码平台，联系QQ：2179975030Umi 打包部署到服务器，刷新页面会报 404 错误，这个问题一般是服务端来处理的，比如 Nginx 代理重定向。Umi 官方也提供了解决方法，下面一一介绍一下。1、改用 hashHistory在配置文件 .umirc.js 中增加一行配置：history: 'hash'复制修改后路由中会由 w3h5.com/index 变成 w3h5.com/#/index ，多了一个 # 号，极不优雅，根据自己的需求做取舍把。history 参数是一个 object 对象，默认值是 { type: 'browser' } ，用来配置 history 类型和配置项。如果只需要修改类型，也可以写成上面的形式。除了 type 之外，该参数还包含 options 子配置项，下面是子项的简单说明：
type 可选 browser、hash 和 memory
options 传给 create{{{ type }}}History 的配置项，每个类型器的配置项不同还可以参考：配置 history 类型和配置项注意：options 中，getUserConfirmation 由于是函数的格式，暂不支持配置options 中，basename 无需配置，通过 umi 的 base 配置指定2、静态化在一些场景中，无法做服务端的 html fallback，即让每个路由都输出 index.html 的内容，那么就要做静态化。在配置文件 .umirc.js 中增加一行/配置：exportStatic: true复制然后执行 umi build，会为每个路由输出一个 html 文件。./dist
├── index.html
├── list
│    └── index.html
└── static
    ├── pages__index.5c0f5f51.async.js
    ├── pages__list.f940b099.async.js
    ├── umi.2eaebd79.js
    └── umi.f4cb51da.css复制注意：静态化暂不支持有变量路由的场景。3、服务端配置路由 fallback 到 index.html也就是我之前整理的一篇文章，可以做参考：Umi&React打包部署到非根目录及刷新报错404的问题解决未经允许不得转载：w3h5 » Umi&React打包部署项目刷新报404错误的几种解决方法本文参与 腾讯云自媒体分享计划 ，欢迎热爱写作的你一起参与！本文分享自作者个人站点/博客：https://www.w3h5.com复制如有侵权，请联系 cloudcommunity@tencent.com 删除。展开阅读全文html5打包htmlreactjavascript举报点赞 4分享登录 后参与评论0 条评论相关文章linux系统下部署项目访问报404错误的解决方法碰到了一个比较奇怪的问题，我在linux系统上安装了一个tomcat服务器，我将一个项目部署到了这个服务器上，然后我去访问这个tomcat，访问成功：砸漏Umi&React打包部署到非根目录及刷新报错404的问题解决在开发中可能一个项目包含多个子项目，如前端项目和后台管理的项目放在同一个服务器目录中。德顺路由器的两种工作模式：hash模式和history模式url中，#后面的字符串就是hash值。
hash是和浏览器对话的，和服务器没有关系，hash值不会作为url的一部分发送给服务器。全栈程序员站长Nginx部署Vue项目以及解决刷新页面4041.在项目中的package.json上右键，点击Show npm ScriptsIT大咖说告别 hash 路由，迎接 history 路由在这里，隆重宣布本博客告别 Vue 传统的 hash 路由，迎接好看而优雅的 history 路由~~Krryspring-boot-plus1.2.0-RELEASE发布-快速打包-极速部署-在线演示geekidea宝塔面板部署vue项目最近有个项目是使用vue开发的前端工程，在历经一个月的开发之后，终于需要上线了。记录一下用宝塔面板部署vue项目上线的过程。Ant丶Tomcat下部署vue项目[history模式]第一种： IP+端口直接访问的方式，如 http://192.168.1.107:8080/
第二种：IP+端口+项目名，如 http://192.168.1....leader755前端踩坑系列《一》记录下最近踩的一些坑，也作为踩坑系列的第一篇，主要是希望以后对遇到的问题，都能够记录下来，下次尽量避免或者在遇到的时候能够快速定位并解决。由于自己的水平有限，遇...GopalFengVue学习之彻底弄懂一个BUG前年的时候，大概花费了半年的光景，使用Python的django web框架配合着django restframework插件作为后端服务Tom2Code解决 Tomcat9w.exe 无法启动服务的问题/更新后 Tomcat9 Properties 配置不匹配的问题最近呢在整理 SSM 框架，为了能在教程中简洁直观地让大家看到全部的流程，我将本机的实验环境全部进行了更新，同时也就遇到了这类问题。首先大家看标题的话可以知道，...白鹿第一帅Tomcat 服务：解决 Apache Tomcat 更新后 Tomcat9w.exe 无法启动 Tomcat 服务的问题
最近在整理 SSM 框架，为了能在教程中简洁直观地让大家看到全部的流程，我将本机的实验环境全部进行了更新，同时也就遇到了这类问题。首先大家看标题的话可以知...白鹿第一帅vuecli3 build之后静态文件出现404今天打包vue-cli3时，扔到服务器上面发现所有的资源都请求失败了，然后去根目录找配置文件，发现没有vue.config这个文件，只有一个babel.conf...kirinReact 项目部署后，页面404解决本地运行，URL为真实的URL，BrowserRouter 可以直接访问到真实 URL。
但是项目打包后，当页面刷新或跳转新页面时，客户端浏览器会向服务器请求...白墨石vue ---webpack 打包上线　　1、打包后将 dist 文件夹和 index.html 放到 tomcat，在浏览器中访问时，出现空白页，f12 提示 404。
　　2、打包好的静态资源均...小蔚Vue部署服务器，刷新页面 404/502 报错在vue项目中，部署项目到服务器的时候报404/502的错误
一般可以用hash()和history.pushState() 作为路由跳转，就下面这样滴
如果...〆 千寻、SpringBoot+jsp项目启动出现404[通俗易懂]发布者：全栈程序员栈长，转载请注明出处：https://javaforall.cn/106967.html原文链接：https://javaforall.cn全栈程序员站长全栈式部署：SpringCloud 微服务+Docker + Vue + nginx 前后端一站式部署本文将带大家从一台全新的 CentOS 服务器开始，部署一套完整的前后端分离项目。操作步骤非常详细，新手友好型文章~solocoderThinkphp+Nginx(PHPstudy)下报的404错误,403错误解决最近一个TP5的项目说放到Nginx下测试看看，下载个 PHPstudy,放到WWW下，配置好域名，直接给个报个404；全栈程序员站长更多文章作者介绍德顺普联软件前端开发工程师普联软件 · 前端开发工程师 (已认证)关注专栏文章530阅读量1.6M获赞936作者排名363精选专题腾讯云原生专题云原生技术干货，业务实践落地。活动推荐腾讯云 x ES 有奖征文参与活动，赢取限量周边礼品立即参加邀请好友加入自媒体分享计划邀请好友，同享奖励 30 / 100 / 180 元云服务器代金券立即邀请运营活动广告关闭关注腾讯云开发者公众号将获得10元无门槛代金券洞察腾讯核心技术剖析业界实践案例目录1、改用 hashHistory2、静态化3、服务端配置路由 fallback 到 index.html社区专栏文章阅读清单互动问答技术沙龙技术视频团队主页腾讯云TI平台活动自媒体分享计划邀请作者入驻自荐上首页技术竞赛资源技术周刊社区标签开发者手册开发者实验室关于视频介绍社区规范免责声明联系我们友情链接归档问题归档专栏文章归档快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档腾讯云开发者扫码关注腾讯云开发者领取腾讯云代金券热门产品域名注册云服务器区块链服务消息队列 网络加速云数据库域名解析云存储视频直播热门推荐人脸识别腾讯会议企业云CDN 加速视频通话图像分析MySQL 数据库SSL 证书语音识别更多推荐数据安全负载均衡短信文字识别云点播商标注册小程序开发网站监控数据迁移Copyright © 2013 - 2023 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有 深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 深公网安备号 44030502008569腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号 |京公网安备号11010802020287扫描二维码扫码关注腾讯云开发者领取腾讯云代金券