Astro Deployment Works Locally, Breaks in Vercel

Question

I have a blog-like project in Astro that works perfectly locally. When I deploy it on Vercel, the images under src won't load. My project tree looks as follows:

.  
└── src/  
    ├── content/  
    │   ├── projects/  
    │   │   ├── images/  
    │   │   │   └── image-example.png  
    │   │   └── project-example.md  
    │   └── config.ts  
    └── pages/  
        ├── project/  
        │   └── [slug].astro  
        ├── tags/  
        │   └── [tag].astro  
        └── index.astro  

I tried moving all the imgaes to public, which made them load but incredibly slowly, and when I try to click into any tag, blog post, etc., I get this: enter image description here or this: enter image description here

For whatever reason, the favicon also refuses to load when deployed to Vercel even though it shows up as the project icon and locally. Not sure if this is related to a larger problem. Would appreciate any help.