Viteではrequire()が使えない
事象
Vue 3をViteで使っているときに発生
画像アセットのURLを動的に変えたいとき、requireを使えなかった
require is not definedと怒られる
類似の質問
javascript - Vite / Vue 3 : "require is not defined" when using image source as props - Stack Overflow
原因
ES Modulesが使えない関係らしい?要調査
結論
new URLを使う
静的アセットの取り扱い | Vite
code:js
function getImageUrl(name) {
return new URL(./assets/${name}.png, import.meta.url).href
}