Edge浏览器不显示Nginx部署的Vue项目——可以访问但是白屏不显示内容，hash和history模式都不显示，非Nginx和Vite配置问题

etsuyou etsuyou 博客等级 墨衍会员 · AI 创作全网分发 墨衍智能分发 本文由作者通过墨衍一键同步至各平台 1分发平台 400+累计阅读 454平均单平台 已同步平台 优快云 微信公众号 微博 知乎 掘金 百家号 博客园 抖音 小红书 你的文章也可以这样分发 墨衍会员 ¥399起/年，写一次发全网 我也要 码龄7年
关注
原创 最新推荐文章于 2026-08-16 09:11:44 发布 454 阅读 AI 写同款· GEO 优化 ›
Vue CLI vue create实战指南：从初始化到生产部署 单页应用（SPA）是现代前端开发的核心交付形态，其工程化落地高度依赖脚手架工具的可靠性与可扩展性。Vue CLI 作为 Vue.js 官方推荐的构建服务层，通过 vue create 命令将 webpack/Vite 配置、插件生态、开发服务器等复杂能力封装为开箱即用的标准化流程。它不仅解决项目初始化问题，更在 TypeScript 支持、路由集成、状态管理选型（如 Pinia）、ESLint 规范、构建优化（Tree-shaking、代码分割）等关键环节提供经生产验证的默认策略。本文聚焦 vue crea 阅读详情
问题描述

在排除 Vue/Vite 和 Nginx 配置问题后，发现常用的 Edge 浏览器一直不显示部署的网页。换成其他浏览器或其他电脑的 Edge 浏览器则可以正常显示。

解决方法

清缓存
在这里插入图片描述
ps：吐槽，真恶心啊……搞了我一上午……

收录于
Linux

当前文章被收录于：

Linux
15 篇文章 0 人学习
订阅专栏 查看详情
前端

当前文章被收录于：

前端
3 篇文章 0 人学习
订阅专栏 查看详情
Vue3

当前文章被收录于：

Vue3
2 篇文章 0 人学习
订阅专栏 查看详情
标签
#nginx #vue.js #运维 #前端 #服务器
#linux #javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
vue3 web项目引入高拍仪 高拍仪的引入步骤就两步，安装SDK，然后根据官网的api进行开发。根据自己需要的功能，请求对应的接口。 阅读详情

相关推荐

C# WinForms实战：5分钟用ScottPlot打造专业级示波器界面（附完整代码）

本文详细介绍了如何在C# WinForms应用中，利用ScottPlot.WinForms库快速构建一个专业级的软件示波器界面。通过从环境配置、静态波形绘制到动态数据实时更新的完整实战演示，帮助开发者高效实现高性能的波形显示功能，适用于工业监控、信号分析等多种场景。

weixin_29198045的博客 831

Vite + Vue3 + Ts 解决打包生成的index.html页面显示空白、资源跨域、找不到资源、404-Page Not Found等错误；关于vite build后访问报错

关于Vite打包后本地访问打包文件空白页面 ；关于vite build后访问报错：Expected a JavaScript module script but the server responded with a MIME type of “

qq_44535402的博客 1万+

【知识点总结】电路原理 第一讲

大家好，从今天起，我将开始更新自上大学以来所学到的各种知识，之所以选择更新它们是因为最近我一直在收拾整理自己自上大学以来所收获到的各种知识，看着那厚厚一沓的书本心里不由得犯愁。如果我想找到特定的知识，那岂不是得翻到猴年马月。俗话说得好，下雨天打鞋子，闲着也是闲着，为此我设置一个专栏，将知识点一一分类总结，目的在于更好的整理所学的知识。本人学艺不精，有一些知识点地方可能存在瑕疵，希望各位大佬可以多多指教。以下是本篇文章正文内容虚断：一般通用性运算放大器的正反向输入端之间的电阻非常非常的大。

weixin_51130221的博客 4万+

vite vue-router history 打包，页面空白问题解决方案

总结一下history模式部署时需要改动的地方如果是部署在根目录下，只需要改nginx配置即可，前端配置无需修改如果是部署在二级目录下(如部署在/newpage目录)，修改内容如下nginx配置vue-router配置vite.config配置此致遍大功搞成了！！！

lie_sun 2378

osgearth2.10 demo功能介绍

osgearth-2.10 demo: 说明： 1、运行环境win7 x64 旗舰版，CPU i5-6400 8核，8G内存； 2、括号内是对应demo的测试参数(.earth)； 3、配置OSG_FILE_PATH； 4、参数命令行可以查看各个demo需要的输入参数； 5、前缀说明：gui界面程序、cmd控制台程序、non功能未知； 6、程序后括号里的non表示不需要通过命令行输入参数； 示例： 1、gui:osgearth_3pv(simple.earth)：相机与地球的投影关系，Range表示相机

rach09的专栏 2422

envi5.3处理高分二号影像数据详细过程记录

全文根据此篇文章进行数据处理： tm影像辐射定标_高分二号影像数据预处理及裁剪过程 其他参考： 学习笔记---遥感影像辐射定标与大气校正 利用ENVI自带全球DEM数据计算区域平均高程 高分二号数据处理流程（有高分二号的数据信息） GF2有多光谱和全色两个数据，MSS是多光谱的，PAN是全色的，多光谱的分辨率低，全色的高，需要把这两个数据融合，融合之前需要做定标等处理，获取经纬度。 一、多光谱影像处理 1. 辐射定标 以这个为例： 其他路径\2022.4.2...

ligous的博客 5万+

vite+vue3打包后部署nginx Failed to load module script，空白页，404，反向代理等问题。

vite打包部署项目到nginx可能会遇到的全部问题。

m0_50360903的博客 4316

Arduino四足开源机器猫-Opencat（导航贴）

本内容由我和小伙伴共同编写，未经授权，谢绝转载！ 1.项目介绍 2.组装调试教程 （一）Opencat-F （1）资料地址(包含程序代码&&3D打印图纸）： 链接：https://pan.baidu.com/s/1AcVA5jSiOSzRKqEQAomrTA 提取码：szfx （2） （二）Opencat-B （1）组装调试 （2）组装调试注意事项 （3）添加新技能 3.编程 ...

qqliuzhitong的博客 4172

解决Vue3+Vite3 打包部署到nginx后配置非根目录刷新页面报错空白

Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.

我不是程序员的博客 1万+

人工智能训练师（三级）操作技能考核·自测卷

为您定制了一份。这份试卷严格拆分了“业务分析”、“智能训练”、“智能系统设计”、“培训与指导”四大模块，所有填空题均来源于上一轮整理的。您可以先用它进行“第二步（抛开答案自己填）”，填完后对照末尾的答案速查进行“第一步（补全并运行）”的校验，最后标记错题进行“第三步（针对性重复练习）”。

suny8088的博客 105

Lammps模拟剪切作用下的位错滑移

Lammps模拟位错与障碍物作用。在lammps中实现周期性位错阵列模型模拟剪切作用下1/2刃位错与障碍物的交互作用

Rockyoung 3461

nginx无法访问 edge浏览器

edge浏览器不知道哪里的问题无法访问nginx

pornhub的博客 1059

EtherCAT从站EEPROM组成信息详解（2）：字8-15产品标识区

以实际的从站EEPROM数据为例，参照EtherCAT的SII规范，详细分析了从站EEPROM字8-字15的产品标识区内容组成。

kevin1499的博客 719

解决vite打包后，index页面空白，静态资源引入路径错误

使用vite打包时，静态资源加载败，本文为图片路径的写法，保证项目在生产环境及开发环境正常显示

like_a_diamond的博客 3538

IMSL CNL 7.0.0 (x86-64)Crack

IMSL CNL 7.0.0 (x86-64)Crack intel的算法库破解文件，这是C++版本的破解文件

VC中sqlite的使用

在VC中对sqlite的使用，实现数据库大批数据的快速插入，读取数据库中的数据在ListCtrl中显示

新版edge更新后Vue.js.devtools插件不显示组件的问题

如下：发现F12打开，插件无法显示组件，刷新无效。点开就有了，以后不用再下插件了！

wangjingzepashei的博客 1024

SIMATIC S7-1200, S7-1500 PID 控制[手册]

SIMATIC S7-1200, S7-1500 PID 控制[手册]

关于项目部署，浏览器访问不到页面有关问题解决方式

关于项目部署，浏览器访问不到页面问题解决方式 说实在话，有时候一段时间不搞编码，一旦动手做，很容易被那些低级错误弄得烦躁得想死，也怪自己没有一个总结的好习惯，此处总结下这类问题的症结所在，纯属自己个人所碰到的，以后碰到其他问题，也会慢慢的加进来，进行补充。。。免得自己再犯类似的低级错误。。。 1、检查tomcat中的webapps下是否成功加载了该项目，如若没有，手动再重新加载。 2、用st

roszhaodan481的专栏 1214

使用vite打包的vue3 ，页面展示为空白

vite默认根目录"/"，file://…访问需要基于index.html的路径，需要再vit.config.js中进行以下配置。vite构建打包后，默认启用ES Module，跨module加载引用涉及跨域，file://…问题：通过npm run build 打包后，点击dist文件夹中的index.html时页面一片空白；需要安装vite插件@vitejs/plugin-legacy。安装成功之后在vit.config.js引入并使用。起因：想看一下做的项目的静态版本。

qq_54601164的博客 1763

RuoYi-Vue3项目Vite打包后页面空白问题解析与解决方案

在使用RuoYi-Vue3进行项目开发时，很多开发者会遇到一个棘手的问题：开发环境下一切正常，但执行`npm run build:prod`打包后，部署到生产环境却出现页面完全空白的情况。这种问题往往让人措手不及，特别是在项目上线前夜。 **典型症状：** - 控制台无任何错误信息 - 网络请求正常，资源加载成功 - 页面DOM结构存在但内容为空 - 开发环境与生产环境表现不一致 ## 根本原...

gitblog_01412的博客 689

【Vue3+Vite】解决build后空白页的问题

build后空白页的问题可能是使用的是历史模式，因为Vue是一个单页的客户端应用，如果没有适当的服务器配置，访问会得到一个 404 错误。使用Hash模式接口解决这个问题，因为使用Hash模式后由于这部分 URL 从未被发送到服务器，所以它不需要在服务器层面上进行任何特殊处理。缺点就是对SEO不友好。

提笔忘字的帝国 2569

【运维、Nginx】解决：在新环境部署web项目时，显示空白页面，但所有资源单独打开都是正常的

此文用作个人遇到的问题解决记录，新环境下部署web项目，空白页面，也没有任何前端报错，项目代码在本地环境正常打开，经查发现，项目站点打开后，所有js文件响应中的content-type为text/plain，而不是application/javascript。此情况为web服务器的环境未正确解析js文件导致，可以设置环境的IMEI即可。

不纯正的逼格的专栏 870

vue3+vite+ts项目直接打开dist中index.html（页面空白问题）

本地直接打开dist中index.html

flhhly的博客 2090

vue项目部署到服务器后浏览器标签上的小图标消失不见

背景： 最近在开发项目过程中发现一个问题，项目部署到服务器后在浏览器打开，会发现浏览器标签上的小图标消失不见了。百度查找问题，网上给出了许多解决的方案，例如清除浏览器缓存、把图标的相对路径改成绝对路径、不用管，第二天它自己就会出现…，解决方案多种多样，只有你想不到的，没有度娘查不到的。但可能相同的问题有时候相同的方法不一定能解决，上面的方法亲测了一遍对我的项目没有作用，可能问题根本不是出现在这里。 问题： vue项目部署到服务器后浏览器标签上的小图标消失不见？ 解决思路： 一开始使用百度进行查找解决方法，

别来...无恙*的博客 3181

Vue3+vite打包后页面空白问题

项目是放在根目录运行，使用默认配置 import.meta.env.BASE_URL 默认输出 '/'；vite.config.js 增加 base: './'如果项目打包后放在二级目录运行，例如：test/dist。nginx配置（项目放在二级目录时配置nginx）里面的【路由History模式打包页面空白】打包后 index.html。

IT菜鸟 8286

vue打包后nginx部署打开白屏，查看net发现资源地址错误（nginx同80端口部署多个vue项目）

vue打包后nginx部署打开白屏，查看net发现资源地址错误（nginx同80端口部署多个vue项目）

CHENC0518的博客 2812

vue首屏白屏原因及解决办法

单页面应用的 html 是靠 js 生成，因为首屏需要加载很大的js文件(app.js 和vendor.js)，所以当网速差的时候会产生一定程度的白屏。（2）做动态路由时，next（）放行与next(...to, replace)区别造成的白屏，实质是路由重复。解决方法：将模式改为hash模式，或者直接把模式配置删除，而且history需要后端配合。（3）第一次正常访问，刷新后白屏，vuex没有与本地存储结合，刷新后导致数据丢失。解决方法：vue.config.js中 publicPath: ''./"

筱✿熙 3962

Vue3路由模式为history，使用nginx部署上线是空白的问题

将vue使用打包后将dist文件的内容，放入nginx的html中，并在nginx.conf中，设置端口启动nginx，打开发现网页内容为空白。

一位热爱编程的青年 880
上一篇： Nginx安装和配置
下一篇： Ubuntu 下安装与完全卸载 Nginx
点赞 3
评论 0
书签 书签 0
etsuyou
etsuyou
博客等级 码龄7年 160粉丝 35原创
+ 关注 专栏目录 订阅专栏
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值