问题:代码上传服务器后,图片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解决方法的更多相关文章

  1. Vue项目开发之打包后背景图片路径错误的坑

    在开发vue项目的过程中,使用浏览器进行预览的时候所有图片的路径是没有任何问题的,但是在打包后传到服务器上,在微信端查看背景图片时,background的图片竟然不显示,img标签里的图片却是正常展示 ...

  2. cropper截图不压缩PHP上传裁剪后的图片

    cropperjs使用不多说网上都有很详细的介绍如下面: https://blog.csdn.net/lxy4239/article/details/78920979 主要讲下使用的经历 裁剪后图片不 ...

  3. Onethink上传服务器后登录不了的问题

    本地修改完Onethink后上传到服务器,进入后台登录的时候,发现输入用户名和密码和验证码后,第一次点击登录没反应,第二次点击提示验证码错误. 经过一研究发现 onethink 的登陆是通过API连接 ...

  4. thinkphp5 上传服务器后 Access denied

    服务器报 Access denied,要么报 No input files,但是在网上查了查说是将 PHP 的cgi.fix_pathinfo 改成 1 即可,但是改成 1 显然是有解析漏洞的,尝试寻 ...

  5. win服务器 文件上传下载出现“未指定的错误” 解决方法汇总

    环境 WIN平台IIS服务器   经常出现于ASPX页面 汇总 1.权限问题 出现场景 : 基于ACCESS数据库   原因解析 : 1.首先需要排除自身问题,例如建表使用关键字,格式错误,插入数据与 ...

  6. ASP.NET 使用ajaxfileupload.js插件出现上传较大文件失败的解决方法(ajaxfileupload.js第一弹)

    在写这篇的时候本来想把标题直接写成报错的提示,如下: “SecurityError:Blocked a frame with origin "http://localhost:55080&q ...

  7. 动态input file多文件上传到后台没反应的解决方法!!!

    其实我也不太清除具体是什么原因,但是后面就可以了!!! 我用的是springMVC 自带的文件上传 1.首先肯定是要有springMVC上传文件的相关配置! 2.前端 这是动态input file上传 ...

  8. DedecmsV5.7本地上传缩略图无法自动添加水印的解决方法

    问题:dedecms后台 系统->图片水印设置 图片水印设置有开启了,但是本地上传缩略图无法自动添加水印 网上有很多资料,所以记录一下 1.打开dede(实际项目后台文件夹)/archives_ ...

  9. php上传文件中文文件名乱码的解决方法

    文件上传是我们在处理表单提交时候最常用的功能之一,今天写了一个小小的demo,如下: 先看结构: html为表单提交的页面,php为处理表单的文件,upload为上传文件所放的位置 html: < ...

随机推荐

  1. Java学习第1天:序言,基础及配置tomcat

    所谓是福不是祸,是祸躲不过,到底还是回到java的阵地上来.既然它这么热,那就学学它,现在这件事已经提上议事日程,也已经开始. 今天做的事: 泛泛的翻了几本书,敲了一些练习代码,比如字符串操作,接口等 ...

  2. DOS下如何打开程序

    cd c:    #先切回主盘,因为最开始在C:\Users\Administrator这个目录下 cd “指定文件所在的盘:”      #切换到文件所在盘 print "文件目录&quo ...

  3. (spfa) Highway Project (zoj 3946 )

    http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemId=5718   Highway Project Time Limit: 2 Seco ...

  4. 【python3+request】python3+requests接口自动化测试框架实例详解教程

    转自:https://my.oschina.net/u/3041656/blog/820023 [python3+request]python3+requests接口自动化测试框架实例详解教程 前段时 ...

  5. ASP .Net C# ---Excel导入导出方法

    导入导出的方法以及引用,可以自行创建一个帮助类 using System;using NPOI.SS.UserModel;using NPOI.XSSF.UserModel;using NPOI.HS ...

  6. WPF概述(硬件加速及分辨率无关性)

    一.名词解释 WPF(Windows Presentation Foundation),直译为Windows表示基础,是专门用来编写程序表示层的技术和工具. 大部分程序都是多层架构的,一般至少包含三层 ...

  7. TextBox Ctrl+A不能全选的问题

    问题: 当TextBox控件在设置了MultiLine=True之后,Ctrl+A 无法全选,十分影响使用体验. 对于这个问题不明所以,不知道是Bug,还是故意而为之... 解决1: 添加KeyDow ...

  8. 【转】C#如何创建泛型类T的实例

    原文地址:https://www.cnblogs.com/lxhbky/p/6020612.html 最近在学历基类的写法时,遇到了一个问题:如何怎么创建一个泛型类T的实例呢?     废话不多说了, ...

  9. Python 脚本利用adb 进行手机控制

    相关参考:https://www.cnblogs.com/bravesnail/articles/5850335.html 一.  adb 相关命令: 1. 关闭adb服务:adb kill-serv ...

  10. ZJOI Round2游记

    虽然一试很惨但是二试还是要来玩一下的 Day 0 到余姚了,然后到余姚边上的宾馆住来下来 顺便一问老师们对边上是不是有什么误解-- 吃完晚饭就回宾馆颓了 话说半夜真刺激--住隔壁那一位手突然骨折了,本 ...