vue-cli4,vue3打包后页面无内容
这个问题百度了一下,各种各样的的回答都有,试了好多种方法,终于解决这个问题
解决方法:
1.在项目根目录下,新建 vue.config.js, 在文件中输入:
module.exports = {
publicPath: process.env.NODE_ENV === 'production'
? './'
: '/'
}
2.修改路由配置,router/index.js
默认使用的 createWebHistory,就是因为使用的 createWebHistory,所以不显示内容,我们需要改成 createWebHashHistory
// 1.需要引入
import { createRouter, createWebHistory, createWebHashHistory } from 'vue-router' // 2.修改配置
const router = createRouter({
history: createWebHashHistory(process.env.BASE_URL),
routes
})
3.重新打包,然后就正常了
vue-cli4,vue3打包后页面无内容的更多相关文章
- vue 使用webpack打包后路径报错以及 alias 的使用
一.vue 使用webpack打包后路径报错(两步解决) 1. config文件夹 ==> index.js ==> 把assetsPublicPath的 '/ '改为 './' 2. b ...
- vue+webpack项目打包后背景图片加载不出来问题解决
在做VUE +的WebPack脚手架项目打包完成后,在IIS服务器上运行发现项目中的背景图片加载不出来检查项目代码发现是因为CSS文件中,背景图片引用的路径问题;后来通过修改配置文件,问题终于解决了, ...
- vue+elementui项目打包后样式变化问题
博主刚刚解决了index.html空白问题,刚打开项目页面又发现了样式出现了大问题,样式与开发版本有很大不同,有些样式没有生效.利用搜索引擎,找到了问题所在以及解决办法:main.js中的引入顺序决定 ...
- 将vue的项目打包后通过百度的BAE发布到网上的流程
经过两天的研究终于将VUE打包后的项目通过BAE发布到了网上.虽然接口方面还有一下问题但是自己还是很高兴的. 首先说一下这个项目需要用到的技术,vue+express+git+百度的应用引擎BAE. ...
- vue通过webpack打包后怎么运行
1. 成功使用webpack打包完成后会默认得到dist的文件夹 2. dist文件夹中有html与其他的静态文件 3. 在dist文件夹中打开命令窗口或者git,开一个服务器(像anywhere) ...
- Struts2添加了<s:debug>后页面无效果的解决方案
一.环境 Struts2版本 struts2.5 二.问题 在jsp页面中添加了<s:debug>后页面上无任何展示. 三.解决 在struts.xml中的struts节点下添加如下常量即 ...
- vue项目 webpack打包后,图片路径是绝对路径
vue项目,使用webpack打包,虽然在全局把路径改成了相对的路径,但是图片引用的路径还是异常的,解决办法如下: 1.config文件夹下index.js中: assetsPublicPath:&q ...
- 配置vue项目将打包后图片文件的引用路径改为cdn路径?
vue cli3项目, 需求: 图片文件打包时, 将项目内的所有图片文件的引用地址改为cdn路径 vue cli3的默认配置下, 打包后图片使用的是相对路径, 例如打包后项目内图片引用路径为 img/ ...
- vue项目webpack打包后修改配置文件
从webpack打包结构中我们知道,vue中有一个存放外部资源的文件夹static,它里面的文件是不会被打包编译的,所以我们就可以利用外部引入js的方式将我们的想要的数据在index.html中以js ...
- Vue通过build打包后 打开index.html页面是空白的
最近在build打包vue项目遇到了几个问题,如下: 1.npm run build打包项目之后,我们通常是把dist文件里面被压缩后的static文件跟index.html提交到服务器,但最近发现直 ...
随机推荐
- 第140篇:微信小程序的登录流程
好家伙,补补补 顶不住了,跑不掉了,这部分的知识还是要补上 来看看微信小程序登录的完整流程 最左边的一列就是前端负责的部分了 几个关键的参数: code:一个用户登录凭证,就是一个临时的t ...
- 【Azure 应用服务】Java ODBC代码中,启用 Managed Identity 登录 SQL Server 报错 Managed Identity authentication is not available
问题描述 在App Service中启用Identity后,使用系统自动生成 Identity. 使用如下代码连接数据库 SQL Server: SQLServerDataSource dataSou ...
- 【Azure Spring Cloud】在Azure Spring Apps上看见 App Memory Usage 和 jvm.menory.use 的指标的疑问及OOM
问题描述 在Azure的Spring Cloud服务 (官名为:Spring Apps)中,在Metrics 页面中查看 App Memory Usage 和 jvm.memory.use,发现两则在 ...
- 【应用服务 App Service】App Service For Windows 如何挂载Storage Account File Share 示例
问题描述 很早之前,介绍了在 App Service for Linux中挂载 Storage Account共享文件,当时Windows无法实现这个功能.而现在,App Service For Wi ...
- Java 韩顺平老师的课,记的(前6章)笔记
https://www.bilibili.com/video/BV1fh411y7R8/?p=110&spm_id_from=333.880.my_history.page.click& ...
- ui转py文件
ui文件转py文件并且使用 简单做一个笔记,以后忘了回来看看 转换 在QT Designer中创建完ui文件后,回到pycharm中,右键点击ui文件,选择pyuic 完成后获得了和ui文件同名的py ...
- Android学习之文件存储
•前言 任何一个应用程序,其实说白了就是在不停地和数据打交道,我们聊QQ.看新闻.刷微博,所关心的都是里面的数据, 没有数据的应用程序就变成了一个空壳子,对用户来说没有任何实际用途. 那么这些数据都是 ...
- better-scroll 1.13
简单入门示例:快速使用: <template> <div class="wrapper"> <div class="content" ...
- Python面向对象之多态和鸭子类型
[一]多态 [1]什么是多态 多态指的是一类事物有多种形态 [2]示例 比如动物有多种形态:猫.狗.猪 import abc class Animal(metaclass=abc.ABCMeta): ...
- 借助 Terraform 功能协调部署 CI/CD 流水线-Part 2
在第一部分的文章中,我们介绍了3个步骤,完成了教程的基础配置: 使用 Terraform 创建 AWS EKS Infra 在 EKS 集群上部署 ArgoCD 及其依赖项 设置 Bitbucket ...