vue-cli构建的vue项目打包后css引入的背景图路径不对的问题
使用vue-cli构建vue项目后，再打包遇到一个css引入的背景图片路径的问题，就是css代码中背景图片是根据相对路径来写的，如下图：
当使用npm run dev命令本地访问的时候，背景图片是正常显示的，可使用npm run build命令打包后，访问dist目录下的项目，页面背景图路径就不对了
解决方法：只需要在build/utils.js文件中添加如下一行代码即可。
publicPath:'../../'
如下图：
这样就解决这个问题。
vue-cli构建的vue项目打包后css引入的背景图路径不对的问题的更多相关文章
- vue项目打包后css背景图路径不对的问题
问题描述: 自己在自学vue做项目的过程中,遇到一个有关背景图片路径的问题,就是css代码中背景图片是根据相对路径来写的,如下图: 当使用npm run dev命令本地访问的时候,背景图片是正常显示的 ...
- vue cli 构建的 webpack 项目设置多页面
1. webpack-dev-server下的设置(npm run dev) ./build/webpack.dev.conf.js 中,修改 new HtmlWebpackPlugin ,一个页面一 ...
- vue+webpack项目打包后背景图片加载不出来问题解决
在做VUE +的WebPack脚手架项目打包完成后,在IIS服务器上运行发现项目中的背景图片加载不出来检查项目代码发现是因为CSS文件中,背景图片引用的路径问题;后来通过修改配置文件,问题终于解决了, ...
- Vue项目用webpack打包后，预览时资源路径出错（文末有vue项目链接分享）
最近用vue写了一些项目,项目写完之后需要打包之后才能放到网上展示,所以在这里记录一下项目打包的过程以及遇到的一些问题. --------------------------------------- ...
- vue项目打包后想发布在apache www/vue 目录下
使用的是vue-element-admin做示例,可以参考Vue项目根据不同运行环境打包项目,其他项目应该大同小异. 使用vue-router的browserHistory模式,配置mode: 'hi ...
- vue+elementui项目打包后样式变化问题
博主刚刚解决了index.html空白问题,刚打开项目页面又发现了样式出现了大问题,样式与开发版本有很大不同,有些样式没有生效.利用搜索引擎,找到了问题所在以及解决办法:main.js中的引入顺序决定 ...
- vue项目打包后资源相对引用路径的和背景图片路径问题
vue项目中若要使用相对路径来获得相应静态资源,需要修改以下内容来确保项目打包后能正常运行. 1.修改config => index.js => build => assetsPub ...
- vue项目打包后运行报错400如何解决
昨天一个Vue项目打包后,今天测试,发现无论localhost还是服务器上都运行不了,报错如下: Failed to load resource: the server responded with ...
- vue build打包后css里的图片路径404不正确的问题
vue build打包后css里的图片路径404 在vue-cli项目中build/utils.js中找到如下代码块,添加 publicPath:’../../’ if (options.extrac ...
随机推荐
- 杭电acm 1039题
这道题也比较简单,写三个函数判断三个条件即可..... 但是开始时我按照已经注释掉的提交,居然提示WA,我百思不得其解,后改成上面的判断式就可以了,求高手解答.... #include "i ...
- PCL — Point Pair Feature 中层次点云处理
博客转载自:http://www.cnblogs.com/ironstark/p/5971976.html 机器人视觉中有一项重要人物就是从场景中提取物体的位置,姿态.图像处理算法借助Deep Lea ...
- 【Boost】boost库中timer定时器 2
博客转载自:http://blog.csdn.net/yockie/article/details/40386145 先跟着boost文档中asio章节的指南中的几个例子学习一下使用: 所有的Asio ...
- EZOJ #79
传送门 分析 在经过若干次操作之后一定会产生一堆环 而我们又发现从一个点到另一个点实际可以经过所有环 于是问题就转换成了$k_1s_1 + k_2s_2 + ... + len = t$ 其中$s_i ...
- p2444 病毒
传送门 分析 先用AC自动机将所有字符串存起来,之后我们从根节点跑一遍dfs 判断时我们只需要判断这个环有没有任意一个字符串的结尾就可以判断是否安全了 注意一个节点的信息需要累加上它fail指针所指位 ...
- meteor 命令文件shell 解析
#!/bin/bash # This is the script that we install somewhere in your $PATH (as "meteor")# wh ...
- GDI+绘图基础
GDI+ 指的是.NET Framwork中提供的二维图像.图像处理等功能,是构成Windows操作系统的一个子系统,它提供了图形图像操作的应用程序编程接口(API). 使用GDI+可以用相同的方式在 ...
- 微信开放平台 redirect_uri参数错误
微信开放平台 redirect_uri参数错误 请注意是开放平台开放平台,公众平台和开放平台不是同一个. 解决办法 在写 授权回调域 时,地址只用写到域名级,不能写到域名下一级,这和QQ互联的回调 ...
- unity googleplay随手记
googleplay设置 进入play console后可以发布应用 点击所有应用->创建应用(这部经常报错误码,多试几次就ok可能和vpn有关) 创建一个应用成功后,这个应用就会包含上面所有选 ...
- [51nod1237] 最大公约数之和 V3（杜教筛）
题面 传送门 题解 我好像做过这题-- \[ \begin{align} ans &=\sum_{i=1}^n\sum_{j=1}^n\gcd(i,j)\\ &=\sum_{d=1}^ ...