vue代码上传服务器后背景图片404解决方法
问题:代码上传服务器后,图片404,使用的font-awesome图标也是404
解决办法:
如果你用了vue-cil,那么在build目录下找到utils.js中的ExtractTextPlugin.extract({}),里面添加下面这个属性就完美解决了publicPath: ‘../../‘

解释:
文件最终会打包压缩为js。当运行的时候,css中的相对路径指向已经发生变化指向了根目录,所以出现加载错误的问题。
下面是这个插件的解释。
extract-text-webpack-plugin
作用:该插件的主要是为了抽离css样式,防止将样式打包在js中引起页面样式加载错乱的现象。
插件参数:该插件有三个参数意义分别如下:
use:指需要什么样的loader去编译文件,这里由于源文件是.css所以选择css-loader
fallback:编译后用什么loader来提取css文件
publicfile:用来覆盖项目路径,生成该css文件的文件路径
原文地址:http://www.mamicode.com/info-detail-2021707.html
vue代码上传服务器后背景图片404解决方法的更多相关文章
- Vue项目开发之打包后背景图片路径错误的坑
在开发vue项目的过程中,使用浏览器进行预览的时候所有图片的路径是没有任何问题的,但是在打包后传到服务器上,在微信端查看背景图片时,background的图片竟然不显示,img标签里的图片却是正常展示 ...
- cropper截图不压缩PHP上传裁剪后的图片
cropperjs使用不多说网上都有很详细的介绍如下面: https://blog.csdn.net/lxy4239/article/details/78920979 主要讲下使用的经历 裁剪后图片不 ...
- Onethink上传服务器后登录不了的问题
本地修改完Onethink后上传到服务器,进入后台登录的时候,发现输入用户名和密码和验证码后,第一次点击登录没反应,第二次点击提示验证码错误. 经过一研究发现 onethink 的登陆是通过API连接 ...
- thinkphp5 上传服务器后 Access denied
服务器报 Access denied,要么报 No input files,但是在网上查了查说是将 PHP 的cgi.fix_pathinfo 改成 1 即可,但是改成 1 显然是有解析漏洞的,尝试寻 ...
- win服务器 文件上传下载出现“未指定的错误” 解决方法汇总
环境 WIN平台IIS服务器 经常出现于ASPX页面 汇总 1.权限问题 出现场景 : 基于ACCESS数据库 原因解析 : 1.首先需要排除自身问题,例如建表使用关键字,格式错误,插入数据与 ...
- ASP.NET 使用ajaxfileupload.js插件出现上传较大文件失败的解决方法(ajaxfileupload.js第一弹)
在写这篇的时候本来想把标题直接写成报错的提示,如下: “SecurityError:Blocked a frame with origin "http://localhost:55080&q ...
- 动态input file多文件上传到后台没反应的解决方法!!!
其实我也不太清除具体是什么原因,但是后面就可以了!!! 我用的是springMVC 自带的文件上传 1.首先肯定是要有springMVC上传文件的相关配置! 2.前端 这是动态input file上传 ...
- DedecmsV5.7本地上传缩略图无法自动添加水印的解决方法
问题:dedecms后台 系统->图片水印设置 图片水印设置有开启了,但是本地上传缩略图无法自动添加水印 网上有很多资料,所以记录一下 1.打开dede(实际项目后台文件夹)/archives_ ...
- php上传文件中文文件名乱码的解决方法
文件上传是我们在处理表单提交时候最常用的功能之一,今天写了一个小小的demo,如下: 先看结构: html为表单提交的页面,php为处理表单的文件,upload为上传文件所放的位置 html: < ...
随机推荐
- ArcGIS API for Silverlight/ 开发入门 环境搭建
Silverlight/ 开发入门 环境搭建1 Silverlight SDK下载ArcGIS API for Microsoft Silverlight/WPF ,需要注册一个ESRI Gloab ...
- 远程算数程序——版本v1.0
很少有需要背诵的程序,但是从这个程序开始,标记的都是必须背诵的. 远程算数程序概述 远程算数程序比较简单,分为服务器端和客户端,客户端发送欲计算的表达式给服务器端,服务端经过计算又返回结果给客户端.如 ...
- Properties类、序列化流与反序列化流、打印流、commons-IO
Properties类 特点: 1.Hashtable的子类,map集合中的方法都可以用: 2.该集合没有泛型,键值都是字符串: 3.是一个可以持久化的属性集,键值可以存到集合中,也可存到持久化的设备 ...
- 20155326 2017-2018-1 《信息安全系统设计基础》课下加分项mypwd实现
20155326 2017-2018-1 <信息安全系统设计基础>课下加分项mypwd实现 pwd命令能做什么 在虚拟机中输入pwd查看其返回的是什么 通过上图得知pwd命令用来显示目录. ...
- 20155326 实验三 敏捷开发与XP实践
20155326 实验三 敏捷开发与XP实践 实验内容 XP基础 XP核心实践 相关工具 实验要求 1.没有Linux基础的同学建议先学习<Linux基础入门(新版)><Vim编辑器 ...
- Hdu2204 Eddy's爱好 2017-06-27 16:11 43人阅读 评论(0) 收藏
Eddy's爱好 Time Limit : 3000/1000ms (Java/Other) Memory Limit : 32768/32768K (Java/Other) Total Subm ...
- hdu 4282 枚举,非二分
http://acm.hdu.edu.cn/showproblem.php?pid=4282 对于方程X^Z + Y^Z + XYZ = K,已知K求此方程解的个数,其中要求X<Y,Z>1 ...
- vi 命令
学习的网址:http://www.cnblogs.com/88999660/articles/1581524.html vi filename: 打开或新建 vi +n filename: 光标置于第 ...
- 11.js循环与函数
Switch语句 Switch(变量){ : 如果变量和1的值相同,执行该处代码 break; : 如果变量和2的值相同,执行该处代码 break; : 如果变量和3的值相同,执行该处代码 break ...
- MySQL--eq_range_index_dive_limit参数学习
官方文档如下描述:This variable indicates the number of equality ranges in an equality comparison condition w ...