vue build打包后css里的图片路径404

在vue-cli项目中build/utils.js中找到如下代码块，添加 
publicPath:’../../’

if (options.extract) {

      return ExtractTextPlugin.extract({

        use: loaders,

        fallback: 'vue-style-loader',

        publicPath:'../../' //添加这句话

      })

    } else {

      return ['vue-style-loader'].concat(loaders)

    }

css中引用的图片地址有问题，需要返回上两级目录，修改后重新打包即可

vue build打包后css里的图片路径404不正确的问题的更多相关文章

  1. 关于npm run build打包后css样式中的图片失效的问题(如background)

    平时run dev都能正常显示的css背景图片在npm run build打包后竟然不显示了(写在标签对中的图片都可以正常显示),而且dist/static/img目录下是确实有这张图片的,于是查看打 ...

  2. vue webpack打包后.css文件里面的背景图片路径错误解决方法

    资源相对引用路径 问题描述 一般情况下,通过webpack+vuecli默认打包的css.js等资源,路径都是绝对的. 但当部署到带有文件夹的项目中,这种绝对路径就会出现问题,因为把配置的static ...

  3. vue webpack 打包后css背景图路径问题

    最近在写vue-webpack项目时,打包后遇到了css背景图片路径报错的问题 奇怪的是,通过img标签引入的图片路径却没有问题,看来是webpack在打包后,读取css中图片的相对路径出错了. 稍微 ...

  4. vue项目打包后css背景图路径不对的问题

    问题描述: 自己在自学vue做项目的过程中,遇到一个有关背景图片路径的问题,就是css代码中背景图片是根据相对路径来写的,如下图: 当使用npm run dev命令本地访问的时候,背景图片是正常显示的 ...

  5. vue-cli构建的vue项目打包后css引入的背景图路径不对的问题

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

  6. vue项目打包后图片路径问题

    当用vue-cli自动构建项目后,有两种运行方法,分别是: npm run dev : 提供一个开发的环境,自动热更新,资源使用绝对路径,所以可以正常看到背景图片. npm run build : 打 ...

  7. vue --- cli build 后的项目，图片路径出错

    今天在插入背景图片过程中,遇到了路径错误的问题,通过网上查询,找到了解决的办法,但是大部分都没有讲造成这种问题的原因,故我简单地总结了一下,并加入了一些自己的理解,欢迎共同探讨~ 当用vue-cli自 ...

  8. Xcode: Run Script 的运用, 使build打包后自动+1

    背景: 每次打包都要build+1处理,比较麻烦,使用 Run Script 的运用使build打包后自动+1 0. 使用xcode 添加run Script 然后就可以添加Run Script了 1 ...

  9. npm run build 打包后，如何运行在本地查看效果（Nginx服务）

    这段时间,研究了一下vue 打包的很慢的问题.但是当我 npm run build 打包后,在本地查看效果的时候,活生生被我老大鄙视了,因为我打开了XAMPP.他说:你怎么不用Nginx啊?用这个一堆 ...

随机推荐

  1. 获取laravel项目的路径的内置帮助函数

    app_path() app_path函数返回app目录的绝对路径: $path = app_path(); 你还可以使用app_path函数为相对于app目录的给定文件生成绝对路径: $path = ...

  2. 导入JSONPathExtractorExample.jmx文件报错，导不进去

    导入之前写的JSONPathExtractorExample.jmx文件,导入不进来,报如下错,百度搜索说是缺少jar包 复制别人的信息如下 有的时候我们会参考别人的jmx文件,但是在导入的时候会报错 ...

  3. jdk源码剖析二: 对象内存布局、synchronized终极原理

    很多人一提到锁,自然第一个想到了synchronized,但一直不懂源码实现,现特地追踪到C++层来剥开synchronized的面纱. 网上的很多描述大都不全,让人看了不够爽,看完本章,你将彻底了解 ...

  4. sql server 存储过程使用游标记录

    sql server 存储过程使用游标记录--方便下次参考使用 游标的组成: 声明游标 打卡游标 从一个游标中查找信息 关闭游标 释放游标 游标类型: 静态游标 动态游标 只进游标 键集驱动游标 静态 ...

  5. 使用模板引擎artTemplate的几个问题总结

    一.Template not found 有的时候模板写的并没有问题,可就是找不到.这时候可能是<script>加载顺序问题,模板渲染在模板加载完成之前先执行了,调整<script& ...

  6. C与C++的部分区别

    1.函数无形参情况 void test() { } int main() { test(,); ; } 在C语言中形参括号没有参数时代表接受任意多的参数,而在C++语言中代表void(无参数) 所以上 ...

  7. js中的内置对象(还没怎么看)

         在js里,一切皆为或者皆可以被用作对象.可通过new一个对象或者直接以字面量形式创建变量(如var i="aaa"),所有变量都有对象的性质.注意:通过字面量创建的对象在 ...

  8. html文件在head标签中引入js地址和直接写js代码，所用时间是不同的，因为引入js地址，文件加载的时候需要通过通讯协议去解析地址，读取外部文件

    html文件在head标签中引入js地址和直接写js代码,所用时间是不同的,因为引入js地址,文件加载的时候需要通过通讯协议去解析地址,读取外部文件

  9. [转]Android 代码自动提示功能

    源地址http://blog.sina.com.cn/s/blog_7dbac12501019mbh.html 或者http://blog.csdn.net/longvslove/article/de ...

  10. 廖雪峰Java3异常处理-2断言和日志-1使用断言

    1.断言 断言Assertion是一种程序调试方式 使用assert关键字 断言条件预期为true 如果断言失败,抛出AssertionError,停止程序 可选的断言消息,断言失败,就会抛出 pub ...