assets won't load #1

Open
opened 2025-05-16 03:24:59 +00:00 by ammaratef45 · 0 comments
Owner

problem

assets like images and icons won't load
Screenshot 2025-05-15 at 8.05.40 PM.png

root cause

the path we use to locate assets is public/assets/computer.png

wget https://resisttechmonopolies.online/public/assets/computer.png                                                                                                   ─╯
--2025-05-15 20:18:58--  https://resisttechmonopolies.online/public/assets/computer.png
Resolving resisttechmonopolies.online (resisttechmonopolies.online)... 192.168.1.67
Connecting to resisttechmonopolies.online (resisttechmonopolies.online)|192.168.1.67|:443... connected.
HTTP request sent, awaiting response... 404 Not Found
2025-05-15 20:18:58 ERROR 404: Not Found.

That same asset can be found if we remove the public/ part

wget https://resisttechmonopolies.online/assets/computer.png                                                                                                          ─╯
--2025-05-15 20:21:30--  https://resisttechmonopolies.online/assets/computer.png
Resolving resisttechmonopolies.online (resisttechmonopolies.online)... 192.168.1.67
Connecting to resisttechmonopolies.online (resisttechmonopolies.online)|192.168.1.67|:443... connected.
HTTP request sent, awaiting response... 200 OK
Length: 12441 (12K) [image/png]
Saving to: ‘computer.png’

computer.png                               100%[========================================================================================>]  12.15K  --.-KB/s    in 0.001s

2025-05-15 20:21:30 (8.75 MB/s) - ‘computer.png’ saved [12441/12441]

Possible solution

Use absolute paths rather than relative path

src="../public/assets/computer.png"

No idea how this looks like yet, but the build command npm run build doesn't keep the public directory in the resulting dist directory

# problem assets like images and icons won't load ![Screenshot 2025-05-15 at 8.05.40 PM.png](/attachments/c2ba3863-2a91-4d1c-88c3-3be82615a8d2) # root cause the path we use to locate assets is `public/assets/computer.png` ``` wget https://resisttechmonopolies.online/public/assets/computer.png ─╯ --2025-05-15 20:18:58-- https://resisttechmonopolies.online/public/assets/computer.png Resolving resisttechmonopolies.online (resisttechmonopolies.online)... 192.168.1.67 Connecting to resisttechmonopolies.online (resisttechmonopolies.online)|192.168.1.67|:443... connected. HTTP request sent, awaiting response... 404 Not Found 2025-05-15 20:18:58 ERROR 404: Not Found. ``` That same asset can be found if we remove the `public/` part ``` wget https://resisttechmonopolies.online/assets/computer.png ─╯ --2025-05-15 20:21:30-- https://resisttechmonopolies.online/assets/computer.png Resolving resisttechmonopolies.online (resisttechmonopolies.online)... 192.168.1.67 Connecting to resisttechmonopolies.online (resisttechmonopolies.online)|192.168.1.67|:443... connected. HTTP request sent, awaiting response... 200 OK Length: 12441 (12K) [image/png] Saving to: ‘computer.png’ computer.png 100%[========================================================================================>] 12.15K --.-KB/s in 0.001s 2025-05-15 20:21:30 (8.75 MB/s) - ‘computer.png’ saved [12441/12441] ``` # Possible solution Use absolute paths rather than relative path https://git.coopcloud.tech/RTM/rtm-website/src/commit/e197ed4e28937292a35d29109e16f11574628275/src/components/Navbar.tsx#L53 No idea how this looks like yet, but the build command `npm run build` doesn't keep the `public` directory in the resulting `dist` directory
Sign in to join this conversation.
No Label
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: RTM/rtm-website#1
No description provided.