<p>I'm using Vue 3 and Vite. After building production in Vite, I ran into an issue with dynamic img src. There is no problem with static img src. </p> <pre class="brush:php;toolbar:false;"><img src="/src/assets/images/my-image.png" alt="Image" class="logo"/>< ;/pre> <p>It works fine in both cases: when running in development mode and after a vite build. But I have some image names stored in a dynamically loaded database (menu icons). In this case I have to write the path like this: </p> <pre class="brush:php;toolbar:false;"><img :src="'/src/assets/images/' menuItem.iconSource" /></pre> <p> (menuItem.iconSource contains the name of the image, such as "my-image.png"). In this case it works when running the application in development mode but not after a production build. When Vite builds the application for production, the path changes (all assets are placed into the <code>_assets</code> folder). Static image sources are processed by the Vite build and the paths will be changed accordingly, but composite image sources are not. It just takes <code>/src/assets/images/</code> as a constant and does not change it (when the application throws 404 not found for image /src/assets/images/my-image.png , I can see it in network monitor)). I'm trying to find a solution and someone suggested using <code>require()</code> but I'm not sure if vite can use it. </p>