Vite+vue3解决发布后图片无法显示与解决Failed to construct ‘URL‘: Invalid URL问题

使用官方引用静态资源处理getImageUrl(name) {return new URL(`./img/${name}.png`, import.meta.url).href}如果没有配置publicDir 选项，需要把图片放在public里面此时发现项目中可以显示图片，但是发布时候报Failed to construct ‘URL’: Invalid URL错误，那是没有把 esbuild

窗外鸟不停

13762人浏览 · 2022-05-19 10:47:05

窗外鸟不停 · 2022-05-19 10:47:05 发布

使用官方引用静态资源处理
```
getImageUrl(name) {
  return new URL(`./img/${name}.png`, import.meta.url).href
}
```
如果没有配置publicDir 选项，需要把图片放在public里面
此时发现项目中可以显示图片，但是发布时候报Failed to construct ‘URL’: Invalid URL错误，那是没有把 esbuild 构建目标设置为 es2020 或更高版本

配置代码：
```
  build: {
    target: 'es2020'
  },
  optimizedeps: {
    esbuildoptions: {
      target: 'es2020'
    }
  },
```