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. AOP拦截日志类,抛异常:java.lang.IllegalStateException: It is illegal to call this method if the current request is not in asynchronous mode

    AOP的日志拦截类中,抛出异常: java.lang.IllegalStateException: It is illegal to call this method if the current r ...

  2. python-使用list和tuple

    list Python内置的一种数据类型是列表:list.list是一种有序的集合,可以随时添加和删除其中的元素. 比如,列出班里所有同学的名字,就可以用一个list表示: >>> ...

  3. pandas数据读取(DataFrame & Series)

    1.pandas数据的读取 pandas需要先读取表格类型的数据,然后进行分析 数据说明 说明 pandas读取方法 csv.tsv.txt 用逗号分割.tab分割的纯文本文件 pd.read_csv ...

  4. Java缓冲流写出数据实例

    public class BufferedWriterDemo throws IOException { public static void main(String[] args) throws I ...

  5. python-Exception异常使用

    Exception #自定义异常类 ,MyInputExcp继承Exception异常 class MyInputExcp(Exception): def __init__(self, lenght, ...

  6. 英语单词omitting

    omitting 来源——报错 [root@centos7 ~]# cp /etc/ /bin cp: omitting directory ‘/etc/’ [root@centos7 ~]# cp ...

  7. POJ 2502 Subway ( 最短路 && 最短路建图 )

    题意 : 给出二维平面上的两个点代表起点以及终点,接下来给出若干条地铁线路,除了在地铁线路上行进的速度为 40km/h 其余的点到点间都只能用过步行且其速度为 10km/h ,现问你从起点到终点的最短 ...

  8. brew安装指定版本的软件

    原文:https://www.jianshu.com/p/aadb54eac0a8 在mac中使用 brew install 安装的软件默认都是最新版本的.有时候我们需要旧版本(指定版本)的时候,应该 ...

  9. CSS实现回到顶部图片hover后改变效果

    任何网站中回到顶部元素不可缺少,一般为了实现交互效果,都会在鼠标hover后元素样式有所改变.今天这个实例便是采用CSS中的transform知识实现. hover: <!DOCTYPE htm ...

  10. sscanf sscanf_s使用

    #include<stdio.h> 定义函数 int sscanf (const char *str,const char * format,........); 函数说明  sscanf ...