vue cli3部署Apache后刷新显示404错误

最新推荐文章于 2024-06-09 09:37:24 发布
最新推荐文章于 2024-06-09 09:37:24 发布
阅读量663 收藏
点赞数
分类专栏： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Legend_hero/article/details/97790638
版权

在项目目录下新建文件.htaccess文件，内容为：

<IfModule mod_rewrite.c> RewriteEngine On RewriteBase / RewriteRule ^index\.html$ - [L] RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule . /index.html [L] </IfModule>

冰是沉默的水、
关注
专栏目录
vue上传apache服务器刷新404的问题处理
qq_41200441的博客
09-28 430
1.安装rewrite_module扩展： 源码安装apache的话： ①find /-name mod_rewrite.c ②cd ①查出来的路径进入文件夹 ③find /-nameapxs ④第三步的路径-c mod_rewrite.c ⑤第三步的路径-i -a -n rewrite mod_rewrite...
解决 VueCLI3 项目打包上线刷新 404 的问题
hedeqiang
05-15 2651
最近我创建的 极客返利平台 采用前后分离的方式。前端框架主要是 VueCLI 搭建的。 但是项目打包上线以后出现二级页面 404 的问题。例如 /about 页面。刷新就会出现 404 。或者直接复制二级页面重新打开同样也是 404。 最终经过一番搜索，解决方案如下： Nginx 例如使用 Nginx 部署，须做如下修改即可 location /{ error_page 404 /index.html; } 重启 Nginx 即可。 sudo service nginx restart Ap
Apache服务器，vue刷新出现404的配置
wuyunhongw的博客
12-18 2077
解决来源：vue 采用mode: ‘history’ 模式的时候，打包上线到Apache配置的web静态服务器的时候，刷新页面的时候会出现404页面。 1-首先安装Apache： ①、打开apache官网http://httpd.apache.org/ （或百度"download apache"）。 ②、点击Download，出现以下界面 。 ③、选择Windows版下载，点击链接。 ④、...
vue3.2项目中使用history路由模式刷新后页面404
猫玖云
04-06 2727
vue3项目中使用history路由模式刷新后页面404
apache和nginx下vue页面刷新404解决方案
Attitude_do_it的博客
01-25 3420
问题描述 记录一个新手很容易遇见的问题，vue的项目，在打包前本地cli模式运行没有任何问题，但是打包完在apache或者nginx中配置了域名后，项目会出现刷新后404的奇怪问题 原因 vue-router的mode使用了history模式，默认应该是hash模式。一般都会因为hash模式的url不够美观，都用的history模式，而问题是由于history模式引起的。history模式下的url并不是真实存在的，所以刷新后会找不到。 当你打包了项目后，一般默认会生成一个dist文件夹，文件夹下有
vue3+ts+history路由模式项目打包部署后刷新显示页面404
qq_57483942的博客
05-08 1422
最近本博主的做了一个医疗的前端开发项目，已经完工了，下面是对部署过程的总结和项目打包部署后刷新显示页面404问题的解决方案。
vue-cli history模式实现tomcat部署报404的解决方式
10-16
在Tomcat中部署Vue CLI构建的项目并采用`history`模式时，遇到404错误的主要原因是服务器没有正确地配置来处理这些动态路由。为了解决这个问题，我们需要按照以下步骤进行配置： 1. **打包Vue CLI项目**： 使用`...
解决vue-cli项目打包出现空白页和路径错误的问题
10-18
在使用Vue CLI构建项目时，有时会遇到打包后出现空白页和路径错误的问题。这些问题通常是由于配置不当或者对Vue CLI的打包机制理解不足所引起的。本文将详细解析这两个问题及其解决方案。 首先，让我们来深入了解...
vuecli3/4 部署到 Nginx，后端接口项目部署到 Tomcat
qq_41433833的博客
04-02 674
部署一、将后端项目springboot-war部署到服务器装的Tomcat上1、jar包部署2、war包部署二、将前端 vuecli3/4 部署到 Nginx1、修改 vue.config.js （没有的话自己新建一个，项目主目录下）2、nginx 配置1、下载 nginx2、打包 vuecli 项目，将文件夹 regcal 利用 Alibaba Cloud Toolkit 工具 上传至 任意目录（为了方便，上传到 nginx 目录的 weapps 目录下）3、修改 nginx 配置文件4、测试 版本说明
Vue 项目部署到服务器的问题解决方法
08-28
很多开发者在使用 Vue-cli 安装的脚手架开发时，在开发环境中项目可以很正常的运行，但是进入到生产环境，编译打包后，放入服务器，项目就不正常了，会出现空白页或者路由跳转404 等问题。 前端配置 在部署 Vue ...
VUE3布置到服务器上之后页面刷新失去页面/本地刷新失去页面
weixin_51263829的博客
12-12 1358
在nginx的nginx.conf中。把publicPath打开。
关于Vue3刷新页面报错404的解决方法
Yang_Ming_Lei的博客
04-26 3624
这时候怎么刷新页面都没有用，只能重新输入地址，一想到每次代码发生改变我都要输入一遍地址，那心情都不好了。在网上看了许多方法都不行，初步判断应该是我的router路由的问题。由于我们的应用是一个单页的客户端应用，如果没有适当的服务器配置，用户在浏览器中直接访问。对了别忘了createWebHashHistory也要引入。当我们去使用这种历史模式时，URL 会看起来很 "正常"，例如。最近正在写VUE3项目时，遇到了一个问题，页面一刷新就出错。也没有发现不对劲的地方。，就会得到一个 404 错误。
VUE3.0打包tomcat后 刷新页面 404错误
明耀的博客
03-20 723
建立WEB-INF目录 里面包含web.xml 内容: <?xml version="1.0" encoding="UTF-8"?> <web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLo...
vue3项目部署后，刷新页面或直接进入某个路由地址时报错404
最新发布
Lilia_00的博客
06-09 1043
通过正确配置服务器，将所有路由请求都指向 index.html，可以确保 Vue Router 能够处理客户端的路由逻辑，从而避免在刷新页面或直接访问某个路由地址时出现 404 错误。选择具体的配置方法取决于你的服务器环境。
vue3 动态路由及使用动态路由后刷新界面出现空白页或者404
AKindofo的博客
03-11 3604
vue3 动态路由刷新404或者空白
Vue3：刷新页面报错404的解决方法
smiledawen的博客
11-09 1517
Vue3：刷新页面报错404的解决方法 - 掘金不同的历史模式 | Vue Router
完美解决Vue3 页面刷新 [Vue Router warn]: No match found for location with path 警告
weixin_45952652的博客
06-13 9425
由于vue3的动态路由问题导致刷新完页面会爆出问题，虽然不影响功能但非常影响心情，解决半天解决不掉，我也是找了好久解决方案，突然由次看到linkadmin的动态路由没有该问题，于是研究之后发现必须在路由注册时候添加好路由守卫功能。
【Vue3】发布为dist后，刷新路由页面出现404错误或Cannot GET /category错误（已解决）
【敦厚的曹操】的专栏
05-20 687
试了N多方法没有解决，最后，在router的配置文件index.js中，把createWebHistory换成createWebHashHistory,解决了！
vue3项目中的404页面
黄钢的博客
02-05 3138
春节前的最后一篇技术博客了写了不少vue项目，发现一直没有正确处理404页面。也就是说404页面是为了防止用户访问不存在的路由地址而设计的，当用户访问一个不存在的地址时，这个地址将会重定向至404页面。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值