vue3+vite+ts中不能使用require

之前使用vue2,去动态设置图片src属性时,采用require,但是vue3+vite+ts中使用require,项目能够运行,但浏览器中报错require未定义,require使用失败,安装@types/node之后使用require也未成功。

HTML

<img :src="getAssetsImages(children.icon.type)" alt="" style="width: 35px;height: 35px;">

1、vue2中给图片动态设置src属性

// 动态获取图片
const getAssetsImages = (name) => {
  return require(`/src/common/images/menu/${name}.png`)
}

2、vue3+vite+ts可以采用如下方案代替

// 动态获取图片
const getAssetsImages = (name) => {
  return new URL(`/src/common/images/menu/${name}.png`, import.meta.url).href
}
Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐