背景
现在有一个场景，有很多的选项卡，点击不同选项卡实现图片的切换。
当我们动态的切换图片url时，会发现图片找不到，报404.
原因
在vite项目中，运行的时候，其实是打包后的代码，所以，图片需要的是打包后的图片路径。
vite在一些情况下会自动转喊路径
css中的静态路径
img中的src（静态路径）
所以我们希望vite帮我们自动转化路径
解决办法
放public目录中
那么它打包后的路径和打包前的路径是一样的，缺点是打包后的文件名丢失了文件指纹。
使用import函数
这个vite也会自动转化。
这种方法打包后会产生额外的js文件（用于转化路径的），增加网络请求。
使用new URL() + import.meta.url
const imgUrl = ref()
const tabs = (path: any)=> {
imgUrl.value = new URL(`../../assets/img/${path}.jpg`, import.meta.url)
}
mport.meta.url，它用作基准 URL。基准 URL 决定了如何解析第一个参数中的相对路径。import.meta.url 表示当前模块的 URL，因此它将用作基准 URL。