vue如何在script中使用图片

我们知道,在<template>中引入图片只需要指明相对路径,打包后就可以正常使用了。

但是在data中引用图片是,在dev模式下只能写绝对路径才能找到图片,写相对路径是无效的,然而这样build打包后就GG了。

以为是路径的问题,其实是webpack的事:在Vue里动态生成的路径无法被url-loader解析到。

此时有两种解决方法:

  1. 直接将静态文件放在项目目录中的static文件夹中,然后正常写路径就可以了。


2.更好用的方法:通过import的方法将图片原路径引入:

直接使用 banner 即可

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容