Vue3 项目打包后页面显示空白的问题可能由多种原因引起。以下是一些常见的排查步骤和解决方案,帮助你定位并解决问题: 1. 检查 Vue3 项目的打包配置 vue.config.js 或 vite.config.js 配置: 确保你的打包配置文件(vue.config.js 或vite.config.js)中的 publicPath 或base 设置正确。这个配置项决定了打包后资源文...
项目build之后,点击dist文件中的index.html文件,打开是空白,提示以下信息。 二、产生原因及解决方法 1.文件路径不对 vite默认根目录"/",file://…访问需要基于index.html的路径,需要再vit.config.js中进行以下配置 2.跨域问题 vite构建打包后,默认启用ES Module,跨module加载引用涉及跨域,file://…没有跨域的定义...
我是通过在vite.config.js 中添加base:'/'配置并修改路由模式 ,路由模式由createWebHistory 改成 createWebHashHistory 就解决了问题!如下图:依次是路由配置文件和vite.config.js
vite项目浏览器兼容性 vue3打包后在低版本浏览器或webview中出现白屏,原因就是因为语法兼容问题。根据vite官方文档描述,build.target默认支持 Chrome >=87、Firefox >=78、Safari >=14、Edge >=88 传送,所以需要我们手动兼容低版本。 解决办法 1.首先安装插件:npm i @vitejs/plugin-legacy -D 2.然后配置vite....
问题1: 打包后,直接点击index.html 显示空白问题 vite.config.js配置, 如果是打包时,base值变为./, 没有这个属性,则配上 base:'./' 这样做还不显示,原因如下: image.png 所以我们需要全局安装一个http-server或者live-server ,这里我用的是: npm install live-server-g ...
vue3打包后在低版本浏览器或webview中出现白屏,原因就是因为语法兼容问题。根据vite官方文档描述,build.target默认支持 Chrome >=87、Firefox >=78、Safari >=14、Edge >=88 传送,所以需要我们手动兼容低版本。 解决办法 1.首先安装插件:npm i @vitejs/plugin-legacy -D ...
ios12 vue3 vite 页面不加载 开发 Vue项目运行npm run build后会生成一个dist文件夹,我们一般都是把这个文件夹部署到服务器上。dist文件夹里边有一个static文件和一个index.html页面,这个index就是最后单页面的最终文件。 问题一:我在打包完成后,打开index.html文件发现地址并没有携带路由。
Vite部署静态站点官方文档 一、本地打包测试 构建应用(打包) npm run build 默认情况下,构建会输出到 dist 文件夹中。 本地测试应用 当你构建完成应用后,你可以通过运行npm run preview命令,在本地测试该应用,利用好控制台,找BUG修BUG。 每次修改代码后要先build构建打包再preview本地测试才能显示出修改代码后最新...
前言:vue项目打包后点击index.html文件时常时空白页面,vue2在配置文件配置后再点击时可以显示页面的,但vue3点击后是看不到页面的,暂时没找到解决方法,不过直接部署到nginx服务器再访问是可以访问到的, 路由…