当前位置:首页 > 编程笔记 > 正文
已解决

Vue 获取 public图片

来自网友在路上 163863提问 提问时间:2023-09-21 12:11:20阅读次数: 63

最佳答案 问答题库638位专家为你答疑解惑

一、Vue静态资源文件夹

Vue 有两个存放静态资源的文件夹:assets和public。
1、 assets文件夹
使用require()方法加载静态资源,如:

require('./assets/image/success.png')

1、这里的文件经过webpack处理过的,require方法的参数不支持变量,只能存文件的路径,因此加载图片时不能动态获取。

2、public文件夹(以前vue1.0版本叫static)
public文件夹的文件是不经过webpack处理,打包时直接把public下的文件复制到打包后的dist的目录下的。一般需要动态获取文件,或者文件很多时使用。
public的文件直接使用process.env.BASE_URL + public下文件的目录路径,如:

data () {return {publicPath: process.env.BASE_URL}
}<img :src="`${publicPath}success.png`">

3、官网assets和public文件介绍
https://cli.vuejs.org/zh/guide/html-and-static-assets.html#public-%E6%96%87%E4%BB%B6%E5%A4%B9

这是转载的文章:

转载的文章:https://blog.csdn.net/u013116210/article/details/118639146

查看全文

99%的人还看了

猜你感兴趣

版权申明

本文"Vue 获取 public图片":http://eshow365.cn/6-10676-0.html 内容来自互联网,请自行判断内容的正确性。如有侵权请联系我们,立即删除!