Skip to content

🐞[Bug]: Multiple Projects Fail to Load Assets Correctly After Deployment Due to Inconsistent Relative Paths #1639

Description

@mrdeyroy

Is there an existing issue for this?

  • I have searched the existing issues

Describe the bug

[BUG] Multiple Projects Fail to Load Assets Correctly After Deployment Due to Inconsistent Relative Paths

Description

Several projects inside the repository work correctly in local development environments but partially break after deployment because of inconsistent or incorrect static asset paths.

The issue mainly affects:

  • CSS files
  • JavaScript imports
  • Images/SVGs
  • Fonts
  • Background assets

Many projects currently use mixed path styles such as:

  • /assets/...
  • ./assets/...
  • ../images/...

These paths behave differently depending on the deployment platform and project folder depth, causing assets to fail loading on platforms like GitHub Pages and Vercel.


Current Behavior

Some deployed projects show:

  • Missing styling
  • Broken images/icons
  • JavaScript functionality not working
  • Missing fonts
  • Empty sections caused by failed asset imports

In some cases, projects work locally but fail only after deployment.


Steps to Reproduce

  1. Clone the repository
  2. Open projects located inside nested directories
  3. Deploy any affected project using GitHub Pages or Vercel
  4. Observe broken CSS/images/scripts in the deployed version

Possible Cause

The repository contains multiple standalone projects created with different folder structures and asset import conventions. Some projects rely on absolute paths that are not deployment-safe.


Additional Notes

This issue appears to affect multiple older projects and could improve overall deployment reliability across the repository.

I would like to work on this issue and submit a PR for it. Kindly assign it to me if approved.

Expected behavior

Expected Behavior

All projects should load assets consistently in both:

  • Local development environments
  • Production deployments (GitHub Pages/Vercel/etc.)

Proposed Solution

  • Audit asset references across projects
  • Standardize relative path usage
  • Replace deployment-breaking absolute paths
  • Ensure compatibility with nested folder deployments
  • Validate all assets after deployment testing

Add ScreenShots

No response

What browsers are you seeing the problem on?

Chrome

Record

  • I have read the Contributing Guidelines
  • I want to work on this issue
  • I am a part of gssoc26

Metadata

Metadata

Assignees

No one assigned

    Labels

    level 110 pointsrecodethis is label for leaderboard

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions