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

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

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

图片路径出错啦！！！

解决方法：

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

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

2.接着把图片地址改为

这样就解决啦~~

Vue打包后访问静态资源路径问题的更多相关文章

  1. 用node.js express设置路径后 子路径下的页面访问静态资源路径出问题

    在routes/news_mian.js 设置了访问news_main.html 的路径 '/',通知设置一个访问news-page.html的子路径'/newspage'子路径.但是在访问loacl ...

  2. vue打包后.woff字体文件路径问题处理

    在执行 npm run build 命令打包后,如果出现 .woff 等字体文件找不到的情况 通过设置 vue-style-loader 打包前缀路径解决

  3. vue打包静态资源路径不正确的解决办法

    vue打包静态资源路径不正确的解决办法 vue项目完成打包上线的时候会碰到静态资源找不到的问题,常见的有两个 1.js,css路径不对 解决办法:打开config/index.js,将其中的asset ...

  4. vue打包后运行在本地/非服务器端环境的访问路径

    vue打包前的配置: 项目目录下--> config文件夹---> index.js: build:  { assetsPublickPath:  './',   // 设置成相对路径   ...

  5. Vue Cli 打包之后静态资源路径不对的解决方法

    cli2版本: 将 config/index.js 里的 assetsPublicPath 的值改为 './' . build: { ... assetsPublicPath: './', ... } ...

  6. vue+webpack静态资源路径引用

    处理静态资产 你可能已经注意到,在项目结构中我们有两个静态资产目录:src/assets和static/.他们之间有什么区别? 要回答这个问题,我们首先需要了解Webpack如何处理静态资产.在*.v ...

  7. vue打包后空白页问题全记录 （background路径，css js404，jsonp等）；

    总结一下vue打包后问题全记录:大部分开发者webpack基本上都是拿来就用的(并没有系统化的研究). 一 >>> 打包之后的静态文件不能直接访问:(例如dist)打包后搭个服务器才 ...

  8. Spring boot 默认静态资源路径与手动配置访问路径的方法

    这篇文章主要介绍了Spring boot 默认静态资源路径与手动配置访问路径的方法,非常不错,具有参考借鉴价值,需要的朋友可以参考下   在application.propertis中配置 ##端口号 ...

  9. SpringMVC访问静态资源的三种方式(转)

    本文转自:http://www.iigrowing.cn/springmvc_fang_wen_jing_tai_zi_yuan_de_san_zhong_fang_shi.html 如何你的Disp ...

随机推荐

  1. gbase整合mybatis出现： Cause: java.sql.SQLException: Can't convert to: binary stream

    参考地址:http://mybatis-user.963551.n3.nabble.com/Map-SQL-Type-LVARCHAR-x-to-JDBC-Type-VARCHAR-globally- ...

  2. AMROC可视化

    备注 通过修改Filetype来改变输出数据的类型. hdf2tab.sh转换全部数据文件 hdf2tab.sh -m多维数据 <!DOCTYPE html PUBLIC "-//W3 ...

  3. Task5.NB_SVM_LDA

    参考:https://blog.csdn.net/u013710265/article/details/72780520 贝叶斯公式就一行: P(Y|X)=P(X|Y)P(Y)P(X) 而它其实是由以 ...

  4. LeetCode--049--字母异位词分组(java)

    给定一个字符串数组,将字母异位词组合在一起.字母异位词指字母相同,但排列不同的字符串. 示例: 输入: ["eat", "tea", "tan&quo ...

  5. LeetCode--045--跳跃游戏II(java)

    给定一个非负整数数组,你最初位于数组的第一个位置. 数组中的每个元素代表你在该位置可以跳跃的最大长度. 你的目标是使用最少的跳跃次数到达数组的最后一个位置. 示例: 输入: [2,3,1,1,4] 输 ...

  6. Flink 在人工智能领域的应用实践

    人工智能是未来十年最重要的技术革命与驱动力,在各行各业产生着日益重要的作用,它与大数据的发展相辅相成,不仅推动人类社会迈入更智慧的世界,也为数据的应用带来无可估量的价值. 11 月 28 - 30 日 ...

  7. 树状数组(一维&二维函数)

    //一维 void add(int x,int p) { while(x<=n)t[x]+=p,x+=(x&(-x)); } int query(int x) { int ans=0; ...

  8. 【HDOJ6684】Rikka with Game（博弈）

    题意:有一个由小写字母组成的字符串,A和B两个人轮流操作,A想让序列的字典序最大,B想最小 两人都能任意选择一位上的字母将其右移一位(a->b,b->c……z->a)或者直接结束游戏 ...

  9. Solr核心（内核）

    Solr核心(内核)   Solr核心(Core)是Lucene索引的运行实例,包含使用它所需的所有Solr配置文件.我们需要创建一个Solr Core来执行索引和分析等操作. Solr应用程序可以包 ...

  10. php面试专题---16、MySQL创建高性能索引考点

    php面试专题---16.MySQL创建高性能索引考点 一.总结 一句话总结: 注意:只写精品 1.索引的基础? 类似书籍的目录:索引类似于书籍的目录,要想找到一本书的某个特定主题,需要先查找书的目录 ...