vite vue项目打包后双击index.html(file://...)无法正常浏览解决

写一个Webview本地加html的项目,html用vite vue3写,打包后http访问没有问题,放在APP内file访问白屏报错,查了2天无解。最终看到Vue3 Vite项目打包静态文件之后无法以file协议访问找到思路。在此文启发下做了些改善记录。

一、文件访问路径URL

vite默认根目录"/",file://…访问需要基于index.html的路径,改

//vite.config.js
export default defineConfig({base: "./",...})

二、跨域问题

vite默认启用ES Module,跨module加载引用涉及跨域,file://…没有跨域的定义,改

pnpm add @vitejs/plugin-legacy -D
pnpm add terser -D
//vite.config.js
import viteLegacyPlugin from "@vitejs/plugin-legacy";export default defineConfig({...plugins: [viteLegacyPlugin({renderModernChunks: false,}),...]
})

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

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

相关文章

视频汇聚/视频监控管理平台EasyCVR接入海康SDK协议后无法播放该如何解决?

开源EasyDarwin视频监控/安防监控/视频汇聚EasyCVR能在复杂的网络环境中,将分散的各类视频资源进行统一汇聚、整合、集中管理,在视频监控播放上,视频安防监控汇聚平台可支持1、4、9、16个画面窗口播放,可同时播放多路视频流&#…

Rust的模块化

Rust的模块化要从Rust的入口文件谈起。 Rust的程序的入口文件有两个 如果程序类型是可执行应用,入口文件是main.rs;如果程序类型是库,入口文件是lib.rs; 入口文件中,必须声明本地模块,否则编译器在编译过…

10. 网络模型使用及修改

10.1 下载网络模型 import torchvision#trauin_data torchvision.datasets.ImageNet("./dataset",split"train",downloadTrue,transformtorchvision.transforms.ToTensor()) # 这个数据集没有办法再公开的访问了 vgg16_true torchvision.models.v…

LeetCode-2511-最多可以摧毁的敌人城堡数目

题目链接 代码实现: class Solution {/** 找 1 -> -1 的时候,经过0的最大个数* 解题思路:双指针*/public int captureForts(int[] forts) {int len forts.length;if(len1){return 0;}int max Integer.MIN_VALUE;boolean flag false;boo…

kafka---- zookeeper集群搭建

1.准备工作: ##准备3个节点,要求配置好主机名称,服务器之间系统时间保持一致 ##注意/etc/hostname 和/etc/hosts 配置主机名称(在这个里我准备Prac-zk-133, Prac-zk-134 , Prac-zk-135二节点) vim /etc/hosts #保证可以通过主机名互通 添加格式为IP 主…

Java异常处理

Java内置了一套异常处理机制,总是使用异常来表示错误。一个健壮的程序必须处理各种各样的错误。所谓错误,就是程序调用某个函数的时候,如果失败了,就表示出错 异常是一种class,因此它本身带有类型信息。异常可以在任何…

Flutter Web 项目网络请求报 XMLHttpRequest error 解决方案

使用http库进行简单的网络请求时,运行在Chrome浏览器上,网络请求一直报错 XMLHttpRequest error,而在iOS 模拟器上运行则正常,后面在postman上发送请求,也是正常的。这就是很尴尬了!!&#xff0…

【计算机基础】Git从安装到使用,详细每一步!扩展Github\Gitlab

📢:如果你也对机器人、人工智能感兴趣,看来我们志同道合✨ 📢:不妨浏览一下我的博客主页【https://blog.csdn.net/weixin_51244852】 📢:文章若有幸对你有帮助,可点赞 👍…

es字段查询加keyword和不加keyword的区别

在ES(Elasticsearch)中,查询字段名后面加上"keyword"和不加"keyword"有着不同的含义和用途。 当字段名后面加上"keyword"时,表示该字段是一个keyword类型的字段。Keyword类型的字段会将文本作为一…

干旱演变研究:定义及研究方法

在水文系统中,每个组分之间互相关联,包气带水、地下水和河川径流相互响应,水文循环处于动态平衡的状态。 降水作为水文系统的输入量,对水文循环具有重要的影响。降水短缺通过水文循环导致水文系统不同组分(包气带、地下水和地表水)发生干旱,降水不足导致土壤含水量减少,…

np.numpy, np.reshape, np.cumsum方法速查

1 np.numpy() 创建一个数组 state[[1,2,3,4,5],[6,7,8,9,10],[11,12,13,14,15]] state2np.array(state) print(state) print(state2)[[1, 2, 3, 4, 5], [6, 7, 8, 9, 10], [11, 12, 13, 14, 15]] [[ 1 2 3 4 5] [ 6 7 8 9 10] [11 12 13 14 15]] 2 np.reshape() 常用于矩阵规…

《Go 语言第一课》课程学习笔记(十三)

方法 认识 Go 方法 Go 语言从设计伊始,就不支持经典的面向对象语法元素,比如类、对象、继承,等等,但 Go 语言仍保留了名为“方法(method)”的语法元素。当然,Go 语言中的方法和面向对象中的方…

【CSS 画个梯形】

使用clip-path: polygon画梯形 clip-path: polygon使用方式如下: 效果实现 clip-path: polygon 是CSS的属性之一,用于裁剪元素的形状。它可以通过定义一个具有多边形顶点坐标的值来创建一个多边形的裁剪区域,从而实现元素的非矩形裁剪效果。…

C++ - 继承

继承的概念 继承机制是面向对象程序设计当中,非常重要且好用的手段,这种手段可以允许程序员在原有的类的特性基础之上,进行拓展从而产生新的类,这些新产生的类,我们成为派生类。在以前,我们实现的复用是函数…

从零开发JavaWeb入门项目--十天掌握

原文网址:从零开发JavaWeb入门项目--十天掌握_IT利刃出鞘的博客-CSDN博客 简介 这是一个靠谱的JavaWeb入门项目实战,名字叫蚂蚁爱购。从零开发项目,视频加文档,十天就能学会开发JavaWeb项目,教程路线是:搭…

Python、PHP和Java下的反序列化漏洞复现实例

环境准备 这篇文章旨在用于网络安全学习,请勿进行任何非法行为,否则后果自负。 python反序列化 p83 CTF夺旗 Python考点SST&反序列化&字符串_正经人_____的博客-CSDN博客 php反序列化 p84 CTF夺旗-PHP弱类型&异或取反&序列化&…

Docker私有镜像仓库(Harbor)安装

Docker私有镜像仓库(Harbor)安装 1、什么是Harbor Harbor是类似与DockerHub 一样的镜像仓库。Harbor是由VMware公司开源的企业级的Docker Registry管理项目,它包括权限管理(RBAC)、LDAP、日志审核、管理界面、自我注册、镜像复制和中文支持等功能。Docker容器应用的…

transformer源码

1.传统RNN网络 每一层都需要上一层执行完才能执行 1.1 自注意力 在一句话中找到it_指代的是什么,它的上下文语境是什么? self-attetion计算 1.2 multi-header机制 1.3 堆叠多层self-attention,相当于再一次卷积 1.4 位置信息编码 1.5 残…

K8S容器OOM killed排查

背景 数据服务平台南海容器k8s设置的内存上限2GB,多次容器被OOM killed。 启动命令 java -XX:MaxRAMPercentage70.0 -XX:HeapDumpOnOutOfMemoryError -XX:HeapDumpPath/apps/logs/ ***.jar排查过程 1 当收到实例内存超过95%告警时,把jvm进程堆dump下…

Data Rescue Professional for Mac:专业的数据恢复工具

在数字化时代,我们的生活和工作离不开电脑和存储设备。但是,意外情况时常发生,例如误删除文件、格式化硬盘、病毒攻击等,这些都可能导致重要的数据丢失。面对数据丢失,我们迫切需要一款可靠的数据恢复工具。今天&#…