vue 项目build后背景图路径不对的问题

news/2024/7/10 1:15:41 标签: vue

1、用css写背景图样式是以相对路径来写的

.details-share{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 114px;
    background: url("../assets/images/share.png");
    background-size: 100%;
}

当使用npm run dev命令本地访问的时候,背景图片是正常显示的,可使用npm run build命令打包后,访问dist目录下的项目,页面背景图路径就不对了,如下
在这里插入图片描述

2、解决方法:只需要在build/utils.js文件中添加如下一行代码即可

publicPath:'../../'

如下图这样设置就可以了:
在这里插入图片描述


http://www.niftyadmin.cn/n/1770318.html

相关文章

uni-app 封装uni.request

1、首先建立一个文件夹,然后新建一个api.js,js中这样来定义,如下: //const baseUrl http://XXXX.com const request (url , date {}, type GET, header { }) > {return new Promise((resolve, reject) > {uni.req…

Ajax之同步请求和异步请求的区别?使用场景?

一、区别 ①、异步: 在异步模式下,当我们使用AJAX发送完请求后,可能还有代码需要执行。这个时候可能由于种种原因导致服务器还没有响应我们的请求,但是因为我们采用了异步执行方式,所有包含AJAX请求代码的函数中的剩余…

uni-app 中将改成异步请求同步化操作

在uni-app中,uni.request等许多接口都是异步的,有时候需要等接口返回数据后在执行下一步的操作,这个时候我们就用到了异步请求同步化操作。 解决方法: 总体思路就是使用async await,使异步问题同步化。需要 注意 的…

JSON.parse() 和 JSON.stringify()的用法

1、JSON.parse()用于将字符串解析成json对象:如下 2、JSON.stringify()用于将对象解析成字符串:如下:

vue+elementUI el-form 查询导致页面刷新

1、列表点击查询条件返回具体的内容,当输入查询条件按下回车或者是点击查询按钮时候发生页面刷新,并没有去查询,很是费解,其他页面就没有这种情况,然而最后发现导致问题发生的原因竟是当表单只有一个文本框时&#xff…

vue中 this.$set

在我们使用vue进行开发的过程中,可能会遇到一种情况:当生成vue实例后,再次给数据赋值时,有时候并不会更新到视图上,如下所示: data () {return {list: [{ name: "zhangsan", id: "1" …

uni-app 微信小程序运行和打包

1、首先要下载安装微信开发者工具(若已安装,则可以忽略) 下载地址: https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html 2、下载完成,然后安装。 3、在程序中配置微信开发者工具的安装位置 ①…

vue实现点击某个dom元素之外的方法

在项目开发中搜索按钮点击出现搜索框内容,这个时候点击搜索框以外的内容,搜索框隐藏掉,如下所示: 1、源码 2、实现点击其他区域搜索框内容隐藏,如下: document.addEventListener(click, (e) > {if (…