title: vite react dynamic image url
body: <p>hello guys i have problem with vite react dynamic images url not loading correctly  and thats my component</p>
  <pre><code> &lt;Flex&gt;
        {data?.map((tag) =&gt; (
          &lt;Box key={tag._id}&gt;
            &lt;Image w=&quot;150px&quot; h=&quot;150px&quot; src={`http:localhost:5000/${tag.imageUrl}`}&gt;&lt;/Image&gt;
          &lt;/Box&gt;
        ))}
      &lt;/Flex&gt;
  </code></pre>
  <p>when i check the network tab i see that the url of the client is added to the image url</p>
  <pre><code>http://localhost:3000/localhost:5000/uploads/1623642756947--Capture.PNG
  </code></pre>
  <p>in create react app maybe we can use <code>reqiure()</code> to fix that but i dont know how to fix that in vite  and adding <code>reqiure()</code> throw an error</p>