vue项目中设置背景图片 vue踩坑系列：backgroundImage路径问题 ...

在vue项目开发中，我们经常会碰到动态添加背景图片的问题，可是当我们在样式中添加了背景图片后，背景图片并不能正常的显示出来，如下css样式 这个时候就要考虑使用其它方式了，node中提供了一种有效的方式来解决这个问题就是require 通过行内样式引入就可以解决背景图片不显示的问题了 ...

问题背景 每个项目都需要在css中用到背景图. vue-cli项目是自动构建生成的, 等到这个项目做通了, 再来记录整个工程目录. 自动构建后的项目, 会有两种运行方式. npm run dev: 这是自动提供的, 可以提供一个开发的环境, 保存, 自动热更新 ...

使用vue-cli构建vue项目后，再打包遇到一个css引入的背景图片路径的问题，就是css代码中背景图片是根据相对路径来写的，如下图： 　　 当使用npm run dev命令本地访问的时候，背景图片是正常显示的，可使用npm run build命令打包后，访问dist目录下的项目，页面背景图 ...

在vue中通过css方式设置背景图不生效，大意了，没有闪。那我们就来看看解决方法吧： 首先在date中定义一个对象，里面配置背景图片的属性，比如图片、是否平铺、图片大小等，然后在需要设置的div中通过：style来绑定这个对象 我有闪，上代码： 这就行了，记得给div加上宽高哦。 ...

1、使用QSS出现很多问题 2、方法 ...

双击Shift --> 搜索‘background’ --> 点击'Set Background Image' ...

...