Vue打包后访问静态资源路径问题


Posted in Javascript onNovember 08, 2019

Vue介绍中static文件夹里放的是静态资源目录,如图片、字体等。

我们发现运行npm run start后本地图片路径是没问题的,但是打包上传后会怎么样呢?

我们知道,执行npm run build 后会生成dist文件夹,把里面的index.html在浏览器运行会发现

图片路径出错啦!!!

Vue打包后访问静态资源路径问题

解决方法:

1.先找到config下的index.js文件

Vue打包后访问静态资源路径问题

把最后的'/' 改为 './'

2.接着把图片地址改为

Vue打包后访问静态资源路径问题

Vue打包后访问静态资源路径问题

以上就是Vue打包后访问静态资源路径问题的相关知识点,感谢大家的阅读和对三水点靠木的支持。

Javascript 相关文章推荐
Javascript实现关联数据(Linked Data)查询及注意细节
Feb 22 Javascript
JS 获取鼠标左右键的键值方法
Oct 11 Javascript
JQuery动态添加和删除表格行的方法
Mar 09 Javascript
轻松学习jQuery插件EasyUI EasyUI创建树形网络(1)
Nov 30 Javascript
Express实现前端后端通信上传图片之存储数据库(mysql)傻瓜式教程(二)
Dec 10 Javascript
js实现图片切换(动画版)
Dec 25 Javascript
Angular.JS利用ng-disabled属性和ng-model实现禁用button效果
Apr 05 Javascript
Three.js的使用及绘制基础3D图形详解
Apr 27 Javascript
Angular.js项目中使用gulp实现自动化构建以及压缩打包详解
Jul 19 Javascript
详解vue.js下引入百度地图jsApi的两种方法
Jul 27 Javascript
TypeScript中使用getElementXXX()的示例代码
Sep 12 Javascript
JavaScript实现简单的计算器
Jan 16 Javascript
在vue中使用echars实现上浮与下钻效果
Nov 08 #Javascript
js 对象使用的小技巧实例分析
Nov 08 #Javascript
JS对日期操作封装代码实例
Nov 08 #Javascript
vue之组件内监控$store中定义变量的变化详解
Nov 08 #Javascript
js 递归json树实现根据子id查父id的方法分析
Nov 08 #Javascript
BootstrapValidator验证用户名已存在(ajax)
Nov 08 #Javascript
微信小程序在text文本实现多种字体样式
Nov 08 #Javascript
You might like
PHP5.5迭代生成器用法实例详解
2016/03/16 PHP
php微信浏览器分享设置以及回调详解
2016/08/01 PHP
Yii2.0建立公共方法简单示例
2019/01/29 PHP
PHP PDOStatement::fetchObject讲解
2019/02/01 PHP
thinkphp5使html5实现动态跳转的例子
2019/10/16 PHP
一些有关检查数据的JS代码
2006/09/07 Javascript
起点页面传值js,有空研究学习下
2010/01/25 Javascript
javascript拓展DOM操作 prependChild insertAfert
2010/11/17 Javascript
各浏览器对click方法的支持差异小结
2011/07/31 Javascript
25个非常棒的jQuery滑块插件和教程小结
2011/09/02 Javascript
js取消单选按钮选中并判断对象是否为空
2013/11/14 Javascript
jquery sortable的拖动方法示例详解
2014/01/16 Javascript
JavaScript中获取样式的原生方法小结
2014/10/08 Javascript
浅谈javascript中字符串String与数组Array
2014/12/31 Javascript
使用jquery动态加载Js文件和Css文件
2015/10/24 Javascript
关于jquery中动态增加select,事件无效的快速解决方法
2016/08/29 Javascript
图片懒加载插件实例分享(含解析)
2017/01/09 Javascript
vue2手机APP项目添加开屏广告或者闪屏广告
2017/11/28 Javascript
JS实现监控微信小程序的原理
2018/06/15 Javascript
React+Webpack快速上手指南(小结)
2018/08/15 Javascript
[01:22:29]真视界:2019年国际邀请赛总决赛
2020/01/29 DOTA
python查询mysql中文乱码问题
2014/11/09 Python
Django接受前端数据的几种方法总结
2016/11/04 Python
Python实现连接postgresql数据库的方法分析
2017/12/27 Python
Python使用pickle模块存储数据报错解决示例代码
2018/01/26 Python
Python 循环终止语句的三种方法小结
2019/06/24 Python
python实现日志按天分割
2019/07/22 Python
python 中不同包 类 方法 之间的调用详解
2020/03/09 Python
HTML5通用接口详解
2016/06/12 HTML / CSS
linux面试题参考答案(8)
2016/04/19 面试题
房屋买卖协议书范本
2014/04/10 职场文书
鉴定评语大全
2014/05/05 职场文书
中药学自荐信
2014/06/15 职场文书
助残日活动总结
2014/08/27 职场文书
教师见习总结范文
2015/06/23 职场文书
GO中sync包自由控制并发示例详解
2022/08/05 Golang