laravel
[1.x] Add remote IDE support
Adds some environment variables to allow cloud IDE to configure the Vite plugin so that things just work out of the box.
There are some current limitations that cloud IDE environments may hit.
The first is that Vite will likely need to run listening on all interfaces. Although this can be manually achieved via npm run dev -- --host, I have added an environment value that allows this to be the default behaviour.
export VITE_HOST=0.0.0.0
With the value in the environment, Vite will automatically listen on all interfaces.
The next hurdle that cloud IDEs may need to customise the format of the public facing dev server URL. This is the URL that is written to the hot file, rendered in Laravel templates, and also transformed in the JavaScript and CSS files when pointing to other resources.
The default format of this URL is {scheme}://{host}:{port}. This results in the standard Vite URL we see locally: http://[::]:5173.
Cloud IDEs may need to have the Vite dev server listening on HTTP while the publicaly rendered URL needs to be HTTPS. Additionally, to format of the publicaly exposed URL may need to be different. For example, one cloud IDE has the format https://{port}-{host}.
This PR introduces a new environment variable to control the publicly exposed dev server URL. The environment variable may contain hard coded information...
export VITE_EXPOSED_DEV_SERVER_URL=https://example.com:5173
However, as some of these values are dynamic, e.g., the port, or configurable, e.g., the host, the environment variable may also contain placeholders that will be replaced with the actual values.
{scheme}, {host}, and {port} are the supported placeholders, e.g.,
export VITE_EXPOSED_DEV_SERVER_URL={scheme}://{port}-{host}
You can mix and match these as needed, for example, if you only needed to retrieve the port from Vite:
export VITE_EXPOSED_DEV_SERVER_URL=https://{port}-my-custom-host.com
why just make the hot file url configurable? combined with vites server config, it lets you do all of this.
:clap: Exactly what I'm looking for to be able to run a "remote" IDE but its just a tailscale serve.
I'd love if this could be pushed through, but I think the changes are not backwards compatible are they?
Works like a charm, except your original description has a typo @timacdonald. The env var you have used in code is LARAVEL_VITE_EXPOSED_DEV_SERVER_URL, note the LARAVEL_ at the beginning.
Would love for this to be released! FWIW, without changing my vite.config.js from the default from laravel new everything remained working. But I'm not sure if other configurations from users might cause issues.
@timacdonald I've been running this custom branch locally and have it working great. But the recent vite changes around CORS has broken it. Seems it needs a rebase (and hopefully can merge it even?)