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. Codeforces 1221F Game With String 思维题

    题意:有两个人玩游戏,游戏规则如下:有一个长度为n的字符串,这个字符串由 . 和 X 构成,Alice可以选择a个连续的 . 把它们变成X, Bob可以选择连续的b个 . 把它们变成X.题目中保证a ...

  2. Sass @warn

    @warn 和 @debug 功能类似,用来帮助我们更好的调试 Sass.如: @mixin adjust-location($x, $y) { @if unitless($x) { @warn &q ...

  3. Python---基础---常用的内置模块

    一. print(math.pow(4,3))   # 4的三次方 #幂运算    函数返回浮点型,幂运算返回整形 print(4**3) #fabs()   对一个数值获取他的绝对值    返回的也 ...

  4. Xib中用自动布局设置UIScrollView的ContenSize

    1. 在UIScrollView上拖一个UIView 2.设置UIScrollView上下左右约束为0,设置UIView上下左右约束为0,并且设置水平中线约束.那么可以把水平中线约束拖到对应视图,利用 ...

  5. redis测试

    1,安装redis软件 2,引入redis jar包 3,案例 package test; import java.util.List; import redis.clients.jedis.Jedi ...

  6. php7新特性的理解和比较

    1. null合并运算符(??) ??语法: 如果变量存在且值不为NULL,它就会返回自身的值,否则返回它的第二个操作数. //php7以前 if判断 if(empty($_GET['param']) ...

  7. 相同name,取最小的id的值,mysql根据相同字段 更新其它字段

    id name info1 a 1232 a 2353 a 1244 b 125 b 987相同name,取最小的id的值id name info1 a 1232 a 1233 a 1234 b 12 ...

  8. p5405 [CTS2019]氪金手游

    题目大意 题意狗屁不通 看毛子语都比看这个题面强 分析 我们假设这棵树是一个内向树 那么我们可以轻易的得到dp[x][i]表示x点子树和为i的期望 转移只需枚举当前期望大小和子树期望大小即可 但是由于 ...

  9. ruby的实例变量

    class Box def initialize(w,h) @width,@height=w,h end def getArea @height*@width end end class BigBox ...

  10. eclipse下实现热部署,tomcat不重新reload context

    1. 打开server的编辑器 2. 在modules页签内,修改auto load属性为disabled