vuejs的图片路径读取不到，vue项目图片绝对路径

js读取img文件夹的图片,但是加载不上去,怎么回事?

1、不可以。img标签创建的是被引用图像的占位空间，ijs是计算电流的意思，计算电流是计算负荷在额定电压下的正常工作电流，因此不可以加载。

2、方法是：①点击编辑器左上角的小三角展开文件目录。②点击文件目录右上角小三角，展开菜单后Add File。③可以直接将图片文件拖到框里，会自动上传，传完后关闭即可，jpg和png格式均支持。

3、你的源码里面就有一些错误，路径应该用\\或者是/，其次，最后结尾应该加上/，还有，一般页面和图片文件夹放在同一位置下，没有干过链接到其他文件夹和目录的操作，应该不是你这样操作的。

相关问答

Q1: Vue项目加载慢,有什么方法可以找到问题原因,怎么解决?

需要的时候加载页面，可以有效的分担首页所承担的加载压力，减少首页加载用时。

优化方法：路由懒加载此方法会把原本打包到一个app.js文件分开成多个js文件打包，这样会减小单个文件的大小，但是不会减小整个js文件夹的大小。通过这种方式可以做到按需加载，只加载单个页面的js文件。

安装 speed-measure-webpack-plugin 查看编译过程中哪些地方消耗时间久，线程多。

本篇文章所说的内容是vue-cli项目中如何缩短首屏加载时间以提高效率，代码都非常详细，有需要的朋友可以看一下。主要是首屏加载太慢。

Q2: Vue项目中img标签src的路径问题

通过这种方式可以了解到： img 标签的路径会被正确转换，而 background-image 不会被转换。举一反三，我们尝试在 data 中写入路径引用：那么这个img路径自然也不会被处理，从而无法显示。public 文件夹在项目根目录。

在平常的处理中，img的src通常采用相对路径的方式来指定，然而在Vue中通过‘：src’动态绑定时不能如此，图片会加载失败。

css用到flex布局很常见，但是使用中遇到了img元素，无图片时选择默认图片，反之用后端传递过来的图片地址。

打包的资源为了回答这个问题，我们首先要明白Webpack是如何处理静态资源的。在*.vue组件里，所有的templates和CSS模块都被vue-html-loader和css-loader解析来查找路径URL。

build的时候，vue默认把图片路径指定在 / 下。图片地址也就是在 /img/xxx.jpg 。如果项目部署在域名是 http：// ， /img/xxx.jpg 自然找不到图片。

Q3: VUE内的JS在引用图片时为什么要require

使用require定义之后，你就可以动态使用了，不用require你就只能写死的。

require 是赋值过程并且是运行时才执行， import 是解构过程并且是编译时执行。

在uniapp、index.vue中导入图片的方法分别如下：在uniapp导入图片的方法是在js中通过require() 引入图片（图片大小不能超过3kb）或在html中通过相对路径引入（绝对路径打包后图片不显示）。

vuejs访问静态资源的变量使用下列方式：使用require语法我们可以在模板中使用require，然后在src属性中传入静态资源的路径来动态引用它们。

包)都可以通过npm来安装管理，nodejs是js运行在服务器端的平台，它使得js的能力进一步提高，我们还要使用nodejs配合 webpack 来完成热加载的功能。所以读者最好有nodejs的开发经验，如果有express的经验更好。

Q4: js图片预览添加看不到图片

鼠标右键点击不显示的图片，选择审查元素（或检查）。在出来的控制台中，右键点击控制台中图片的src属性的链接，选择新窗口打开图片。在新窗口打开的图片依旧不显示，那肯定是你的图片不存在，或路径错误。

出现这种情况的原因就是使用了express的框架用了静态服务。app.use(express.static(path.join(__dirname， ‘public’)))；就是讲所有的静态资源文件都托管到public文件夹里。

可能是你没有安装插件，有的可能是FLASH的 ；你的防火墙阻止了浏览；网速问题；你的浏览器的问题；---证明方法：把它复制到word里，就看到了，就证明你的浏览器有问题。

关于vuejs的图片路径读取不到和vue项目图片绝对路径的介绍到此就结束了，不知道你从中找到你需要的信息了吗 ？如果你还想了解更多这方面的信息，记得收藏关注本站。