Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[1.x] Add remote IDE support #305

Draft
wants to merge 1 commit into
base: 1.x
Choose a base branch
from
Draft

[1.x] Add remote IDE support #305

wants to merge 1 commit into from

Conversation

timacdonald
Copy link
Member

@timacdonald timacdonald commented Oct 17, 2024

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

@timacdonald timacdonald marked this pull request as draft October 17, 2024 04:47
@nurdism
Copy link
Contributor

nurdism commented Oct 30, 2024

why just make the hot file url configurable? combined with vites server config, it lets you do all of this.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants