vue项目build打包后图片路径不对导致图片空白不显示问题解决方法
1、在上篇文章src配置及引入的基础上修改项目配置：
文章链接地址：https://www.cnblogs.com/hsl-shiliang/p/10333022.html。
2、具体配置过程如图：
（1）、修改config文件夹下的index.js文件下的build对象下如下（修改 assetsPublicPath:'/' 为 assetsPublicPath:'./'）：
（2）、修改build文件夹下的utils.js文件如下（需添加 publicPath:'../../'）：
示例：（1）未修改publicPath的图片路径，图片无法正常显示。
（2）添加publicPath的图片路径，可以正常显示。
3、重新npm run build 即可。
vue项目build打包后图片路径不对导致图片空白不显示问题解决方法的更多相关文章
- vue项目webpack打包后图片路径错误
首先项目是vue-cli搭建的,项目结构如下: 然后发现在css里写的图片引用地址在开发时正常显示,但在打包扔上服务器之后报错 报的是404,路径前面多了/static/css,不知道为啥. 在自己慢 ...
- 配置vue项目将打包后图片文件的引用路径改为cdn路径?
vue cli3项目, 需求: 图片文件打包时, 将项目内的所有图片文件的引用地址改为cdn路径 vue cli3的默认配置下, 打包后图片使用的是相对路径, 例如打包后项目内图片引用路径为 img/ ...
- vue开发完成后打包后图片路径不对
用vue做了一个小的移动端项目,从头到尾做下来,感觉自己好多东西都没弄清楚过.也学到了很多,已整理笔记在自己电脑上,但是比较零散,空了再来仔细整理整理. 于是,上周五模拟好数据(接口还未写),准备打包 ...
- vue项目 webpack打包后，图片路径是绝对路径
vue项目,使用webpack打包,虽然在全局把路径改成了相对的路径,但是图片引用的路径还是异常的,解决办法如下: 1.config文件夹下index.js中: assetsPublicPath:&q ...
- vue项目打包后图片路径问题
当用vue-cli自动构建项目后,有两种运行方法,分别是: npm run dev : 提供一个开发的环境,自动热更新,资源使用绝对路径,所以可以正常看到背景图片. npm run build : 打 ...
- Vue通过build打包后 打开index.html页面是空白的
最近在build打包vue项目遇到了几个问题,如下: 1.npm run build打包项目之后,我们通常是把dist文件里面被压缩后的static文件跟index.html提交到服务器,但最近发现直 ...
- vue项目webpack打包后修改配置文件
从webpack打包结构中我们知道,vue中有一个存放外部资源的文件夹static,它里面的文件是不会被打包编译的,所以我们就可以利用外部引入js的方式将我们的想要的数据在index.html中以js ...
- Vue项目build打包部署到Tomcat后，刷新报404错误解决方案
问题描述: 一.更新依赖,并打包项目 cd /root/.jenkins/workspace/v-test;npm installcd /root/.jenkins/workspace/v-test; ...
- vue项目中打包background背景路径问题
项目中图片都放在src/img文件夹,img和background-image引用都用相对路径,即../../这种形式 在打包build的设置路径assetsPublicPath: ‘./‘,然后那些 ...
随机推荐
- less:注释
less有两种注释方法,一种是// 一种是/**/ 这两者的区别是/**/是会被编译成css里面,而//则不会 举个例子(使用的less在线编译器) 我们看到//注释并没有编译到css里面
- vue2.0 之 directive指令 (自定义)
指令 一.定义: 指令只一种可以附加到DOM元素的微命令(tiny commands). 它们通常以"v-"作为前缀, 以方便Vue知道你在使用一种特殊的标记, 从而确保语法的一致 ...
- 动态新增删除tbody表格行与ajax请求完成后刷新父窗口问题
获取tbody内的一行数据,包括hidden类型的数据$("#tbody_id").find("tr").each(function(){ var tdArr ...
- js----定义变量的几种方式
const const定义的变量不可以修改,而且必须初始化 const b = 2 //正确 //const b //错误,没有初始化 console.log('函数外const定义b:' + b); ...
- 如何将数组中的元组包转化为字典通过json序列化给前端
- 监听UDP端口
功能:监听服务器的UDP端口,输出端口接收的数据 #encoding:utf-8 import socket global udp global ip global port def listen_p ...
- 超大文件上传方案（B/S）
javaweb上传文件 上传文件的jsp中的部分 上传文件同样可以使用form表单向后端发请求,也可以使用 ajax向后端发请求 1.通过form表单向后端发送请求 <form id=" ...
- 循序渐进实现仿QQ界面（三）：界面调色与控件自绘
本篇讲述如何进行界面调色.界面调色一般有两种方法,调色板和HSL色彩变换.调色板局限于256色,这里不采用,因此用HSL色彩变换实现.首先要了解一下什么是HSL色彩空间,完整且详尽的知识请到维基百科去 ...
- php面试专题---Mysql索引类型、介绍及优点
php面试专题---Mysql索引类型.介绍及优点 一.总结 一句话总结: 精品视频讲解里面的资料来源也是通过各种资料,比如博客.书等,只不过是基于讲解者的知识体系有整理的过程 1.B-Tree索引三 ...
- http请求方法，get 对比 post
本文转自:http://www.w3school.com.cn/tags/html_ref_httpmethods.asp 两种最常用的 HTTP 方法是:GET 和 POST. 什么是 HTTP? ...