vue如何动态加载显示本地图片资源

在实际开发中，根据某一个变量动态展示图片的情况有很多。实现方法分打包构建工具的差异而不同。
1、webpack的项目

require引入图片资源

2、vite的项目

new URL(url,base).href

疑问解答：为什么vite项目不可以用require？

原因在于，vite的模块化规范是ES Modules,所以vite项目在打包构建时无法解析require（commentJS规范里引入资源的语法）引入资源的方式。