I'm in the process of developing a game using PIXI.js that will be accessed through URL X but loaded on another website at URL Y.
To make this possible, I've implemented an environment variable called BASE_URL. This variable is set to '' when working locally, and 'https://something.web.app' when not local.
Here's how I am implementing it:
import avatar from "../assets/images/avatar.svg";
const BASE_URL = process.env.BASE_URL || '';
loader.add(BASE_URL + avatar);
It seems like this method is functioning correctly for the most part. Initially, it makes the correct request (with BASE_URL) but then proceeds to make another request without BASE_URL. The issue with the second request can be seen in the image below:
https://i.sstatic.net/pqGI3.png
As a result, the image fails to display properly within the game container.
When I remove the BASE_URL (as done a few hours ago), it only sends one request for the image.
Any suggestions on what steps I could take next? I'm utilizing ParcelJS to bundle everything together.