vue3引入图片等无法使用require，需要用newURL来动态引入图片等静态资源_vue3 require 图片加载不出来

作者：很楠不爱3 | 2024-02-15 19:32:16

踩

vue3 require 图片加载不出来

Uncaught (in promise) ReferenceError: require is not defined

1、因为require是webpack提供的一种加载能力，但是vue3项目时搭配vite的，所以这里应该用vite提供的静态资源载入方法，

官方文档：https://vitejs.cn/guide/assets.html#the-public-directory

将上面的require改为new URL这种格式，页面就可以正常加载静态资源了

<img :src="image" />

const image = new URL('@/static/images/error.svg', import.meta.url).href
1
2
3

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/很楠不爱3/article/detail/86304