background-image背景图片路径问题可以这样解决：
1、先在data里面导入这张图片，例如：
                bg:require('./openIndexBG2.jpg')
2、然后在template里面对这个div做个绑定，例如：
    <div  :style="{backgroundImage: 'url(' +bg + ')'}" >
这样就可以避开因打包而造成的的路径问题了！

VUE - 相对路径的更多相关文章

  1. VSCode 在 Vue 导入路径中使用 @ 符号后无法正确跳转 bug

    VSCode 在 Vue 导入路径中使用 @ 符号后无法正确跳转 bug bug jsconfig.json { // This file is required for VSCode to unde ...

  2. 在vue中路径中的@

    1.在Vue的路径中@等于src 2.在css的路径中~@等于src

  3. vue 跟路径加载缺少跟前缀

    vue 加载资源失败:跟路径残缺,都是配置时 一个正斜杠 / 多余惹的祸

  4. vue相对路径修改

    如果静态文件不是部署在网站根目录下,vue-cli将给你造成巨大的麻烦. 你不能直接把build好的文件抛进一个目录.你不能直接在本地打开用vue做好的静态网站. 改成相对路径,主要需要做两步. 1. ...

  5. 基于webpack的vue项目路径别名

    在vue的项目里,我们可以使用../这样的相对路径的方式引用不同目录的组件: import userinfo from '../../../components/userinfo.vue'; 使用.. ...

  6. webstorm中不能识别react、vue alias 路径别名符号

    https://blog.csdn.net/weixin_37939942/article/details/89388466 因为我平时比较喜欢使用ws做开发,所以在使用vue或react的时候只要使 ...

  7. Vue之vue中的data为什么是一个函数+vue中路径别名alias设置

    问题描述 为什么在vue组件中,我们的data属性必须是一个函数,new Vue()中的data除外,因为new Vue中只有一个data属性. 原因 因为我们能抽离出来的组件,肯定是具有复用性的,它 ...

  8. vue 相对路径的图片 不显示问题

    例如 data () { return { img: '../../images/jifen/index/img_list_default_pic.jpg' //路径也没问题啊,怎么不显示呢,难道他瞎 ...

  9. vue 图片路径问题

    图片路径问题 module.exports = { // 根据环境区分 生产服务器production比如php服务器的地址 和 开发服务器dev的地址 // npm run serve是开发环境de ...

随机推荐

  1. 神州数码OSPF Stub（末梢区域）和Totally Stub（完全末梢区域）的配置

    实验要求:了解末梢区域及完全末梢区域的配置 拓扑如下 R1 enable 进入特权模式 config 进入全局模式 hostname R1 修改名称 interface l0 进入端口 ip addr ...

  2. 小程序仿QQ侧滑例子

    缩放:wxml <!--page/one/index.wxml--> <view class="page"> <view class="pa ...

  3. Centos yum 命令行 安装KDE Desktop

    1:修改yum源为本地源 (见相关随笔:centos 配置本地yum源) 2:# yum groupinstall "X Window System" ← 安装基本的X系统组件# ...

  4. python 4

    一.列表相关操作 l = ['布偶猫', '小断腿', '大白'] # . append l.append('哎呀') print(l) # . insert l.insert(, '小猪佩琪') p ...

  5. APPlication,Session和Cookie的区别

    方法 信息量大小 保存时间 应用范围 保存位置 Application 任意大小 整个应用程序的生命期 所有用户 服务器端 Session 小量,简单的数据 用户活动时间+一段延迟时间(一般为20分钟 ...

  6. python txt文件常用读写操作

    文件的打开的两种方式 f = open("data.txt","r") #设置文件对象 f.close() #关闭文件 #为了方便,避免忘记close掉这个文件 ...

  7. Go Example--状态协程

    package main import ( "fmt" "math/rand" "sync/atomic" "time" ...

  8. 【HDU5187】contest

    真的没有什么会写的东西了QAQ 原题: As one of the most powerful brushes, zhx is required to give his juniors n probl ...

  9. 为什么浏览器User-agent总是有Mozilla字样

    你是否好奇标识浏览器身份的User-Agent,为什么每个浏览器都有Mozilla字样?Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 ( ...

  10. 服务跟踪sleuth和可视化跟踪工具Zipkin

    一.增加配置 在Order工程中添加配置 <dependency> <groupId>org.springframework.cloud</groupId> < ...