vue3打包后页面空白解决方法

vue3打包后页面空白解决方法

    • 问题
    • 解决方法

问题

最近写一个小项目
没有打包的时候一切正常

技术栈用的vue3 + vite
我用的是npm创建的项目

npm init vue@latest

问题一 :打包后页面空白,什么都没有
在这里插入图片描述
问题二:刷新页面后找不到资源
把url的index.html去掉后可以正常显示但是刷新后又会出现新的问题
问题如下
在这里插入图片描述

解决方法

第一步
先在vite.config.js中添加一行代码

base:'/'

在这里插入图片描述

第二步
在router/index.js中把createWebHistory 换成createWebHashHistory
这里默认是createWebHistory
在这里插入图片描述
到此问题解决,打包测试应该没啥问题了!
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/617192.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

最佳解决方案:如何在网络爬虫中解决验证码

Captcha(全自动区分计算机和人类的公开图灵测试)是广泛应用的安全措施,用于区分合法的人类用户和自动化机器人。它通过呈现复杂的挑战,包括视觉上扭曲的文本、复杂的图像或复杂的拼图等方式,要求用户成功解决这些挑战以…

5、MAE:探索视觉预训练模型

目录 1、论文 2、背景与动机 3、回答的问题 4、创新与卖点 5、实现细节 模型框架 具体步骤 简单代码示例 6、一些资料 1、论文 Masked Autoencoders Are Scalable Vision Learnershttps://arxiv.org/pdf/2111.06377.pdf 2、背景与动机 在深度学习和计算机视觉的领域中…

Centos7,Python3.7.6安装模块Crypto,pycryptodome,ibm_db,requests,requests_pkcs12

Centos7,Python3.7.6安装模块Crypto,pycryptodome,ibm_db,requests,requests_pkcs12 Python版本:python3.7.6 对应的各种模块 前言:把python项目放到linux上运行时,提示缺少各种模块,安装命令…

【NetApp数据恢复】NetApp存储中Oracle数据库数据恢复案例

NetApp数据恢复环境: NetApp某型号存储,存储中有数十块SAS硬盘,该型号NetApp存储硬盘是扇区大小是520字节。存储中的lun都映射给小型机使用,存放Oracle数据库文件,采用ASM裸设备存储方式。 NetApp存储故障&#xff1a…

Linux tail命令详解和高级用法举例

目 录 一、概述 二、tail命令解释 1.命令格式; 2.功能 3.选项 4.选项的基本用法 (1) 显示行号 (2)忽略指定字符数 (3) 不显示文件名 三…

前端面试题集合一

Canvas是什么?怎样写Canvas? Canvas是HTML5的一个元素,它使用JavaScript在网页上绘制图形。Canvas是一个矩形区域。它的每一个像素都可以由HTML5语言来控制。使用Canvas绘制路径、框、圆、字符和添加图像有几种方法。 如果要在我们的HTML文…

ASP .net core微服务实战(杨中科)

背景: 主要是思考下,我们为什么要用微服务? 微服务我现在理解是:提供了我们一种模块化的手段,一个服务负责一种类型的业务,是一种面对复杂问题进行拆分的方式,但是也会引入一些中间件&#xf…

【期末考试】网络综合复习宝典

相关链接 网络复习思维导图(HCIP)https://www.edrawsoft.cn/viewer/public/s/038e2370897928 详述循环冗余校验CRC码https://blog.csdn.net/liht_1634/article/details/124328005?app_version6.2.6&codeapp_1562916241&csdn_share_tail%7B%22…

小魔推行业玩法:生活美容怎么做短视频矩阵?

如今每个实体老板都想让自己生意做的更好,那就需要有更多获取流量的方式,获得大量的同城曝光;在市场内卷的状况下,通过短视频来做门店引流无疑是绝佳的方式,让更多同城的用户知晓自己的门店,这个时候通过小…

12.8-1.8

2023.12.8 redis容器 docker run -p 6379:6379 --name redis -v /mydata/redis/data:/data -v /mydata/redis/conf/redis.conf:/etc/redis/redis.conf -d redis redis-server /etc/redis/redis.conf redis.conf不存在,需先在宿主机创建该目录下文件&#xff0c…

FilterQuery过滤查询

ES中的查询操作分为两种:查询和过滤。查询即是之前提到的query查询,它默认会计算每个返回文档的得分,然后根据得分排序。而过滤只会筛选出符合条件的文档,并不计算得分,并且可以缓冲记录。所以我们在大范围筛选数据时&…

使用U盘作为系统的启动盘

1.我们使用到的工具ventoy-1.0.96.rar 下载资源 https://download.csdn.net/download/u011442726/88735129 2.怎么使用 ventoy软件的使用非常简单,直接解压后,把u盘插到电脑,然后点击exe这个文件即可。 然后点击之后,直接点击安…

设计模式之享元模式【结构型模式】

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档> 学习的最大理由是想摆脱平庸,早一天就多一份人生的精彩;迟一天就多一天平庸的困扰。各位小伙伴,如果您: 想系统/深入学习某…

FridaHook(三)——AllSafe App wp

By ruanruan,2022/04/21 文章目录 1、不安全的日志记录2、硬编码3、pin绕过(1)反编译查看方法判断逻辑(2)hook方法A、Hook areEqual(Object,Object)B、Hook checkPin(a) (3)页面效果&#xff08…

芯课堂 | 一种带WIFI的智能多电机控制系统

现有技术中,每台智能家电基本均需配置一台电机及一个WiFi模组,每台智能家电的电机均通过对应的WiFi模组连接家庭无线路由器进行组网,从而实现网络连接。 但是,这种方式存在技术瓶颈。例如,当一个家庭中智能家电的数量…

80V 72V 60V 48V 降12V 5V 3.3V 功耗低降压恒压芯片H6603

输入电压80V、72V、60V、48V:这些是电源系统中的不同电压水平,通常用于驱动各种设备。例如,电动汽车、电动自行车或工业设备中的电池系统可能以这些电压级别工作。 降12V:这可能是指一种电源模块,其功能是将输入电压&…

HDFS WebHDFS 读写文件分析及HTTP Chunk Transfer Coding相关问题探究

文章目录 前言需要回答的问题DataNode端基于Netty的WebHDFS Service的实现 基于重定向的文件写入流程写入一个大文件时WebHDFS和Hadoop Native的块分布差异 基于重定向的数据读取流程尝试读取一个小文件尝试读取一个大文件 读写过程中的Chunk Transfer-Encoding支持写文件使用C…

xcode安装及运行源码

抖音教学视频 目录 1、xcode 介绍 2、xcode 下载 3、xocde 运行ios源码 4、快捷键 1、xcode 介绍 Xcode 是运行在操作系统Mac OS X上的集成开发工具(IDE),由Apple Inc开发。Xcode是开发 macOS 和 iOS 应用程序的最快捷的方式。Xcode 具有…

2024.1.11 关于 Jedis 库操作 Redis 基本演示

目录 引言 通用命令 SET & GET EXISTS & DEL KEYS EXPIRE & TTL TYPE String 类型命令 MGET & MSET GETRANGE & SETRANGE APPEND INCR & DECR List 类型命令 LPUSH & LRANG LPOP & LPOP BLPOP & BRPOP LLEN Set 类型命…

SwiftUI 为任意视图加上徽章(Badge)而想到的(下)

概览 在 SwiftUI 为任意视图加上徽章(Badge)而想到的(上) 这篇文章中,我们讨论了如何使用 Preference 技术打造 SwiftUI 中任意视图上徽章的实现。 虽然,我们完成了一系列挑战最后基本得偿所愿,不过在上篇的实现中仍有些许不尽如人意之处。 在本篇博文中,您将学到如下…