vite 不支持requrie require is not defined

vite 动态引入图片的时候会报错， require is not defined

网上很多推荐的是写法是配置vite-plugin-require-transform
但是这个不是稳定，我安装配置后一直报错
[vite] Internal server error: This experimental syntax requires enabling one of the following parser plugin(s): "jsx", "flow", "typescript". (1:0)

image.png

去插件githu查看issue,暂无法解决

image.png

放弃了，不再挣扎了。

替换成下面的方法进行引入
1.new URL

const loadingName = (name) => {
  return new URL(`../src/assets/${name}.svg`, import.meta.url).href;
};

<img alt="Vue logo" class="logo" :src="url2" width="125" height="125" />

2.import

const loading = async (name) => {
 const src = await import(`/src/assets/${name}.svg`);
 url.value = src.default;
 return src.default;
};
<img
     alt="Vue logo"
     class="logo"
     :src="loading('logo')"
     width="125"
     height="125"
   />